JavaScript Cookie blinkt versteckt DIV für Sekundenbruchteil

Ich habe eine Popup-Lightbox auf meiner Seite, ich habe auch ein Cookie mit JavaScript, um nur diese Pop-up-Lightbox alle 15 Tage zu zeigen.JavaScript Cookie blinkt versteckt DIV für Sekundenbruchteil

Der Code tut, was ich will, außer wenn ich die Seite aktualisieren, um das Cookie zu überprüfen, blinkt mein Pop-up-Lightbox auf dem Bildschirm für einen Bruchteil einer Sekunde und geht dann weg.

Wie verhindere ich das?

Testseite - http://mymsaa.org/videos/test-lightbox/

Meine Testseite hat eine Menge von Skripten auf sie haben für Plugins und meine Wordpress-Theme, so kann ich nicht den ganzen Code schreiben.

Die Javascript ...

<script type="text/javascript"> 

function createCookie(name,value,days) { 
if (days) { 
    var date = new Date(); 
    date.setTime(date.getTime()+(days*24*60*60*1000)); 
    var expires = "; expires="+date.toGMTString(); 
} 
else var expires = ""; 
document.cookie = name+"="+value+expires+"; path=/"; 
} 

function readCookie(name) { 
var nameEQ = name + "="; 
var ca = document.cookie.split(';'); 
for(var i=0;i < ca.length;i++) { 
    var c = ca[i]; 
    while (c.charAt(0)==' ') c = c.substring(1,c.length); 
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); 
} 
return null; 
} 

function eraseCookie(name) { 
createCookie(name,"",-1); 
} 

function setTheDivStyle() { 
if(!readCookie('wroteIt')) { 
// if cookie not found display the div and create the cookie 
document.getElementById("theLink").style.display="block"; 
createCookie('wroteIt', 'wroteIt', 1); // 1 day = 24 hours persistence 
} 
else { 
// if cookie found hide the div 
document.getElementById("theLink").style.display="none"; 
} 
} 
</script>

Mein Pop-up Leuchtkasten ...

<div id = "theLink" style="display:block"><!--LIGHTBOX-->  

<div class="ezmodal" ezmodal-autoopen="true"> 
<div class="ezmodal-container"> 

<!--IFRAME FORM-->            
<div id='subscribe_popup' style='overflow: hidden; overflow-y:hidden;'> 
<div style="padding: 10px;"> 

<iframe src="http://mymsaa.org/wp-content/themes/dw-focus/video_register/iframe/iframe.php" border="0" frameborder="0" scrolling="no" name="pop"></iframe> 
</div> 
</div> 
<!--IFRAME FORM--> 

<div class="ezmodal-footer"> 
<button type="button" class="btn1" data-dismiss="ezmodal">X</button> 
</div> 

</div> 
</div> 

<!--LIGHTBOX--></div>

Mein BODY-Tag ...

<body <?php body_class(); ?> onload = "setTheDivStyle()">

Quelle

2016-04-28 Gina DiSanto

einfach verstecken es von Anfang an indem Sie dem div einen display:none Stil im ursprünglichen HTML geben:

<div id = "theLink" style="display:none"><!--LIGHTBOX-->

Dann wird der onload Event-Handler, den Sie haben, bei Bedarf anzeigen. So wird es nie angezeigt, während die Seite geladen wird, aber das Ereignis wurde noch nicht ausgelöst.

Quelle

2016-04-28 18:09:55 trincot

Wie verstecke ich es von Anfang an? –

Wie ich schon sagte: Im HTML-Code ändern Sie das 'style' Attribut, um' display: none' zu erwähnen. – trincot

Ich sehe deine Änderung jetzt, vielen Dank !!! Es funktioniert super! –

JavaScript Cookie blinkt versteckt DIV für Sekundenbruchteil

Antwort

Verwandte Themen