У меня есть кнопка для перехода в полноэкранный режим, на кнопках написано ON или OFF , что прекрасно работает:
<div class="onoffswitch" onclick="fullscreen()">
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch">
<label class="onoffswitch-label" for="myonoffswitch">
<span class="onoffswitch-inner"></span>
<span class="onoffswitch-switch"></span>
</label>
</div>
Но когда я вНа экране и я нажимаю ESC, кнопка по-прежнему показывает OFF Итак, я попытался смоделировать эффект щелчка:
document.getElementById("myonoffswitch").click();
Я думал, что моя проблема была решена, но потом я обнаружил, что .click также срабатывает при нажатии кнопки в полноэкранном режиме.Кнопка дважды сработает.
Затем я попытался предотвратить обычную реакцию нажатия:
<div class="onoffswitch" onclick="fullscreen(); return false;">
Но тогда ничего не произошло, .click больше не менял кнопку,Хотя я понимаю, почему: .click - это как обычный щелчок, а обычный щелчок возвращается как ложный.
Я много искал и пробовал, но не нашел ничего подходящего для меня.
Это мой javascript на данный момент:
function fullscreen() {
if ((document.fullScreenElement && document.fullScreenElement !== null) ||
(!document.mozFullScreen && !document.webkitIsFullScreen)) {
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();
}
}
}
document.addEventListener('fullscreenchange', exitHandler);
document.addEventListener('webkitfullscreenchange', exitHandler);
document.addEventListener('mozfullscreenchange', exitHandler);
document.addEventListener('MSFullscreenChange', exitHandler);
function exitHandler() {
// Any fullscreen change will trigger this function
// Normalscreen to fullscreen or fullscreen to normalscreen
// with the button or with ESC-key.
if (!document.fullscreenElement && !document.webkitIsFullScreen && !document.mozFullScreen && !document.msFullscreenElement) {
document.getElementById("myonoffswitch").click();
// This event is always trickered, but it's meant to be trickered when ESCAPE is used,
}
}
Я сделал скрипку, но она не работает, я все еще публикую ее, потому что это более простой способ использования javascript: JsFiddle
И поскольку скрипка не сработала, я выложу ее на свой веб-сайт, пока проблема не будет решена: проблема решена
Пустья знаю, если что-то не понятно, спасибо
[EDIT]
Я решил это самостоятельно
Обновлен JsFiddle