Хочу сделать кнопку перехода в полноэкранный режим. В Chrome работает нормально, в Firefox остается белая полоса внизу. После некоторых действий - пропадает (например, если вызвать инструменты разработчика).
Скрин полосы:
Попробовал повторить на JSfiddle - не получилось, там проблемы нет, окно разворачивается нормально.
Локально проблема остается.
Код:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta charset="UTF-8" />
<style type="text/css">
html, body {
margin: 0;
padding: 0;
overflow: hidden;
}
#world {
position: absolute;
width: 100%;
height: 100%;
overflow: hidden;
background: linear-gradient(#e4e0ba, #f7d9aa);
}
#wrap {
position: relative;
}
#fullscreen-button {
display: block;
margin: 50px auto;
min-width: 100px;
min-height: 60px;
background: rgba(122, 122, 122, .6);
border: 0;
cursor: pointer;
font-family: sans-serif, monospace;
font-size: 13px;
color: #fff;
}
</style>
</head>
<body>
<div id="world"></div>
<div id="wrap">
<button id="fullscreen-button">Go Fullscreen!</button>
</div>
<script type="text/javascript">
document.getElementById('fullscreen-button').onclick = function() {
if (!document.fullscreenElement &&
!document.mozFullScreenElement && !document.webkitFullscreenElement) {
if (document.documentElement.requestFullscreen) {
document.documentElement.requestFullscreen();
} else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen();
} else if (document.documentElement.webkitRequestFullscreen) {
document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.cancelFullScreen) {
document.cancelFullScreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
}
};
</script>
</body>
</html>
Надеюсь, кто-то сможет объяснить с чем это связано и как это исправить.
Заранее спасибо.
Источники:
https://developer.mozilla.org/ru/docs/Web/API/Elem...
https://developer.mozilla.org/ru/docs/DOM/Using_fu...
___
UPD: Если не трудно, отпишитесь, удалось ли повторить проблему у себя?