gpt4 book ai didi

按钮

转载 作者:行者123 更新时间:2023-11-30 18:02:50 30 4
gpt4 key购买 nike

所以我有这个 javascript 片段,它有两个按钮可以进入全屏,一个按钮可以退出全屏。我想做到这一点,如果我不在全屏模式下,按钮会显示转到全屏模式,而当我处于全屏模式时,按钮会显示退出全屏模式...所以基本上我只需要一个按钮就可以进入/退出全屏。

<html>
<head>
<script>
function launchFullscreen(element) {
if(element.requestFullScreen) {
element.requestFullScreen();
} else if(element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if(element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
}
}

function cancelFullscreen() {
if(document.cancelFullScreen) {
document.cancelFullScreen();
} else if(document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if(document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
}

</script>
</head>
<body>

<button onclick="launchFullscreen(document.documentElement);">Launch Fullscreen</button>

<button onclick="cancelFullscreen();">Hide Fullscreen</button>

</body>
</html>

最佳答案

将id添加到按钮并仅切换按钮例如:

function launchFullscreen(element) {
if (element.requestFullScreen) {
element.requestFullScreen();
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if (element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
}
//hide full screen button
this.style.display ='none'
//show exit button
document.getElementById("btn_cancel_fullscreen").style.display ='inline'

}

function cancelFullscreen() {
if (document.cancelFullScreen) {
document.cancelFullScreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
//hide cancel full screen button
this.style.display ='none'
//show full screen button
document.getElementById("btn_fullscreen").style.display ='inline'
}
<button id='btn_fullscreen' onclick="launchFullscreen(document....)"> Fullscreen</button>
<button id='btn_cancel_fullscreen' style='display:none' onclick="cancelFullscreen();">Hide Fullscreen</button>

关于按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16494768/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com