Fonts, fullscreen, gamepad, and html5lib tests should use testRunner instead of layou...
[WebKit-https.git] / LayoutTests / fullscreen / full-screen-zIndex.html
1 <!DOCTYPE html>
2 <html>
3     <head>
4         <script>
5             var runPixelTests = true;
6             
7             function init() {
8                 // Bail out early if the full screen API is not enabled or is missing:
9                 if (Element.prototype.webkitRequestFullScreen == undefined) {
10                     logResult(false, "Element.prototype.webkitRequestFullScreen == undefined");
11                     endTest();
12                 } else {
13                     waitForEventAndEnd(document, 'webkitfullscreenchange');
14                     runWithKeyDown(goFullScreen);
15                 }
16             }
17             
18             function goFullScreen() {
19                 document.getElementById('block1').webkitRequestFullScreen();
20             }
21         </script>
22         <script src="full-screen-test.js"></script>
23         <style>
24             #block1 {
25                 width: 200px;
26                 height: 100px;
27                 border: 4px solid darkgreen;
28                 background-color: green;
29                 z-index: 100;
30                 position: relative;
31             }
32             #block2 {
33                 width: 100px;
34                 height: 50px;
35                 border: 4px solid darkred;
36                 background-color: red;
37                 z-index: 500;
38                 position: relative;
39                 left: 50px;
40                 top: 25px;
41             }
42         </style>
43     </head>
44     <body onload="init()">
45         <div>This tests that an element with a positive z-index appears behind the full screen element.  
46              After entering full screen mode, only a green box should be visible.
47              Click <button onclick="goFullScreen()">go full screen</button> to run the test.</div>
48         <div id="block2"></div>
49         <div id="block1"></div>
50     </body>