세션 당 한 번만 팝업 표시

이것은 현재 코드입니다. 세션 당 한 번만 팝업을 표시 할 수 있습니까? 기본적으로 추가 제품을 홍보하는 magento 결제 페이지에있는 이미지 팝업입니다세션 당 한 번만 팝업 표시

<!-- Trigger/Open The Modal --> 
<style><!-- 
.button { 
    display:none!important; 
--></style> 
<div class="button"><button id="myBtn">.</button></div> 
<!-- The Modal --> 
<p>&nbsp;</p> 
<style><!-- 
@media (max-width: 979px) { 

.modal { 
    display:none!important; 
} 
} 
--></style> 
<div id="myModal" class="modal"><!-- Modal content --> 
<div class="modal-content"><img id="Image-Maps-Com-image-maps-2016-09-01-150341" alt="" src="http://www.prowrestlingtees.com/images/checkoutpopup.png" height="312" width="432" usemap="#image-maps-2016-09-01-150341" /> <map id="ImageMapsCom-image-maps-2016-09-01-150341" name="image-maps-2016-09-01-150341"> 
<area style="outline: none;" title="" shape="rect" coords="0,249,208,306" href="http://www.prowrestlingtees.com/pwcrate-collectible.html" alt="" target="_self" /> 
<span class="close"> 
<area style="outline: none;" title="" shape="rect" coords="222,252,429,307" alt="" target="_self" /> 
</span> 
<area style="outline: none;" title="Image Map" shape="rect" coords="430,310,432,312" href="http://www.image-maps.com/index.php?aff=mapped_users_0" alt="Image Map" /> 
</map></div> 
</div> 
<style><!-- 
/* The Modal (background) */ 
.modal { 
    display: inline; /* Hidden by default */ 
    position: fixed; /* Stay in place */ 
    z-index: 1; /* Sit on top */ 
    left: 0; 
    top: 0; 
    width: 100%; /* Full width */ 
    height: 100%; /* Full height */ 
    background-color: rgb(0,0,0); /* Fallback color */ 
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ 
} 

/* Modal Content/Box */ 
.modal-content { 
    margin: 15% auto; /* 15% from the top and centered */ 
    text-align: center; 
    width: 80%; /* Could be more or less, depending on screen size */ 
} 

/* The Close Button */ 
.close { 
    color: #aaa; 
    float: right; 
    font-size: 28px; 
    font-weight: bold; 
} 

.close:hover, 
.close:focus { 
    color: black; 
    text-decoration: none; 
    cursor: pointer; 
} 
--></style> 
<script type="text/javascript">// <![CDATA[ 
// Get the modal 
var modal = document.getElementById('myModal'); 

// Get the button that opens the modal 
var btn = document.getElementById("myBtn"); 

// Get the <span> element that closes the modal 
var span = document.getElementsByClassName("close")[0]; 

// When the user clicks on the button, open the modal 
btn.onclick = function() { 
    modal.style.display = "block"; 
} 

// When the user clicks on <span> (x), close the modal 
span.onclick = function() { 
    modal.style.display = "none"; 
} 

// When the user clicks anywhere outside of the modal, close it 
window.onclick = function(event) { 
    if (event.target == modal) { 
     modal.style.display = "none"; 
    } 
} 
// ]]></script>

어쨌든이 작품을 만들 수 있습니까? 어떤 도움 주셔서 감사합니다

출처

2016-09-01 MHeredia

설정 쿠키 또는

if($.session.get("myVar") == "false") { }

는 그래서는 다음과 같이한다 그렇지 않으면 "이미 표시된"정보를 어딘지에서 페이지 재로드를 통해 지속될 장소에 저장하십시오. 그런 다음 모든 페이지로드시 해당 사실을 확인하십시오. –

내 대답을 확인하십시오,이 작동합니까? – Anokrize

if($.session.get("myVar") == "false") { $.session.set("shown", "true"); // set it to true var id = '#dialog'; //Get the screen height and width var maskHeight = $(document).height(); var maskWidth = $(window).width(); //Set heigth and width to mask to fill up the whole screen $('#mask').css({'width':maskWidth,'height':maskHeight}); //transition effect $('#mask').fadeIn(1000); $('#mask').fadeTo("slow",0.8); //Get the window height and width var winH = $(window).height(); var winW = $(window).width(); //Set the popup window to center $(id).css('top', winH/2-$(id).height()/2); $(id).css('left', winW/2-$(id).width()/2); //transition effect $(id).fadeIn(2000); }

세션 당 한 번만 팝업 표시

답변

관련 문제