59 lines
1.8 KiB
HTML
59 lines
1.8 KiB
HTML
<style>
|
|
div {
|
|
background-color: pink;
|
|
-webkit-align-self: stretch;
|
|
-webkit-flex: 1;
|
|
position: relative;
|
|
}
|
|
.vertical {
|
|
-webkit-writing-mode: vertical-lr;
|
|
}
|
|
.inner {
|
|
display: inline-block;
|
|
height: 500px;
|
|
}
|
|
</style>
|
|
<script src="full-screen-test.js"></script>
|
|
<body>
|
|
<div><div class=vertical>
|
|
<div class="inner">This div becomes a stretched flex item in fullscreen mode, and should
|
|
become normal-sized again once leaving it.</div>
|
|
<div class="inner">Number 2</div>
|
|
<div class="inner">Number 3</div>
|
|
<div class="inner">Number 4</div>
|
|
</div></div>
|
|
<script>
|
|
// Bail out early if the full screen API is not enabled or is missing:
|
|
if (Element.prototype.webkitRequestFullScreen == undefined) {
|
|
logResult(false, "Element.prototype.webkitRequestFullScreen == undefined");
|
|
endTest();
|
|
} else {
|
|
var callback;
|
|
var fullscreenChanged = function(event)
|
|
{
|
|
if (callback)
|
|
callback(event)
|
|
};
|
|
waitForEvent(document, 'webkitfullscreenchange', fullscreenChanged);
|
|
|
|
var div = document.getElementsByTagName('div')[0];
|
|
var oldHeight = div.offsetHeight;
|
|
|
|
var divEnteredFullScreen = function(event) {
|
|
callback = divExitedFullScreen;
|
|
document.webkitExitFullscreen();
|
|
};
|
|
|
|
var divExitedFullScreen = function(event) {
|
|
callback = null;
|
|
testExpected(div.offsetHeight, oldHeight);
|
|
div.innerHTML = ""; // simplify the text dump
|
|
endTest();
|
|
};
|
|
|
|
callback = divEnteredFullScreen;
|
|
runWithKeyDown(function(){div.webkitRequestFullScreen()});
|
|
}
|
|
</script>
|
|
<button onclick="div.webkitRequestFullScreen()">Enter Fullscreen</button>
|