我有一些代码,当浏览器窗口调整为横向模式时会显示一条消息。这很好用,但现在我希望用户能够使用按钮关闭消息,并且用户只需要在整个 session 中执行一次。我想您为此需要 sessionStorage,但我不知道如何结合现有代码对此进行编码。任何帮助将不胜感激。
Please open in "full page" mode and scale your window to a portrait size to see the message appear.
<br>
<br>
<div id="warning-message">
<button type="button" id="landscape-button">X</button>
<p><span id="headertext">please rotate your screen</span>
<br>
<br>This website is best viewed in landscape mode. So please, rotate your mobile device, and if activated also disable your screen rotation lock. If you prefer to remain in portrait mode, ignore this message and close it at the "x".</p>
</div>
#warning-message {
display: none;
}
@media only screen and (orientation:portrait) {
#warning-message {
display: block;
}
}
@media only screen and (orientation:landscape) {
#warning-message {
display: none;
}
}
#warning-message {
position: fixed;
margin: 0 auto 0 auto;
z-index: 99999999;
background-color: #2A3847;
width: 90vw;
min-height: 90vh;
text-align: center;
padding: 25px 15px 35px 15px;
right: 0;
left: 0;
}
#landscape-button {
background-color: #2A3847;
color: #ffffff;
border-radius: 0px;
border: 1px solid white;
padding: 10px 10px 10px 10px;
float: right;
margin-top: -25px;
margin-right: -15px;
font-size: 1.3em;
}
p {
font-size: 1.3em;
color: #ffffff;
positie: absolute;
text-align: center;
"><span style="margin: 0 0 0 25px;
text-align: center;
font-size: 1.5em;
letter-spacing: -0.04em;
}
#headertext {
margin: 0 0 0 25px;
text-align: center;
font-size: 2em;
letter-spacing: -0.04em;
}
最佳答案
$('#warning-message').on('click',function(){
var data = sessionStorage.getItem('isfirst');
if(data == undefined)
{
sessionStorage.setItem('isfirst', 'true');
//close the pop
}
})
现在每次检查
sessionStorage.getItem('isfirst');
这将在 session 中存储
关于javascript - 使按钮关闭整个 session 的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44902835/