simple go to fullscreen on the single element - though CSS is not working yet

This commit is contained in:
Remy Sharp 2013-01-13 23:53:36 +00:00
parent 9a5834465d
commit 6a9749da6c
2 changed files with 12 additions and 5 deletions

View File

@ -4,10 +4,10 @@
"url": "fullscreen",
"tags": "fullscreen",
"support": {
"live": "opera",
"nightly": "chrome firefox safari"
"live": "opera chrome firefox safari",
"nightly": ""
},
"test": ""
"test": "document.body.requestFullscreen !== undefined"
},
{
"desc": "Stream video and filter with canvas",

View File

@ -12,7 +12,8 @@
<p>This example shows how an element can request fullscreen support from the browser.</p>
<p id="unavailable">Not supported :(</p>
<div id="game">
<button id="gofull">Go fullscreen</button>
<button id="goback">Go back to non-fullscreen</button>
</div>
</article>
<script>
@ -39,12 +40,18 @@ function available() {
return !!shim(document.body)
}
var no = $('#unavailable');
var no = $('unavailable'),
go = $('gofull'),
back = $('goback');
if (available()) {
no.parentNode.removeChild(no);
}
go.onclick = function () {
shim(this.parentNode).call(this.parentNode);
}