製作按鈕關閉整個會話的div

Question

我有一些代碼，它顯示瀏覽器窗口大小爲橫向模式時的消息。這很好，但現在我希望用戶能夠使用按鈕關閉消息，並且用戶只需要在整個會話中執行一次該操作。我想你需要sessionStorage，但我不知道如何編碼這個結合我現有的代碼。任何幫助將不勝感激。

AN EXAMPLE HERE

 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; 
} 

Answer 1

$('#warning-message').on('click',function(){ 
var data = sessionStorage.getItem('isfirst'); 
if(data == undefined) 
{ 
sessionStorage.setItem('isfirst', 'true'); 
//close the pop 
} 
}) 

現在每次檢查

sessionStorage.getItem('isfirst'); 

這將被認爲存儲會話