JQuery - Popup-Anzeige nur einmal anzeigen

Question

Das folgende Popup-Fenster wird angezeigt, wenn die Maus den Bildschirm verlässt. Ich brauche einen Cookie oder etwas, um dies nur einmal anzuzeigen (ich bin ein wenig Neuling), kann aber nicht herausfinden, wie man das in den Code einbaut.

// Exit intent 
function addEvent(obj, evt, fn) { 
    if (obj.addEventListener) { 
     obj.addEventListener(evt, fn, false); 
    } 
    else if (obj.attachEvent) { 
     obj.attachEvent("on" + evt, fn); 
    } 
} 

// Exit intent trigger 
addEvent(document, 'mouseout', function(evt) { 
    if (evt.toElement == null && evt.relatedTarget == null) { 
     $('.lightbox').slideDown(); 
    }; 
}); 

// Closing the Popup Box 
$(document).ready(function(){ 
    $('#close').click(function(){ 
     $('.lightbox').slideUp(); 
    }); 
}); 

Sie können den Code in Aktion sehen hier: http://championcontainersnz.com/buy_estimate

Jede Hilfe Sie würden zur Verfügung stellen kann sehr geschätzt. Vielen Dank.

Answer 1

Das folgende Beispiel Sie mit dem Code angezeigt, die Sie zur Verfügung gestellt haben. Sie brauchen nur eine Variable zum Speichern, wenn die Box aufgetaucht ist oder nicht.

var isPopped = false; 
 
// Exit intent 
 
function addEvent(obj, evt, fn) { 
 
    if (obj.addEventListener) { 
 
    obj.addEventListener(evt, fn, false); 
 
    } else if (obj.attachEvent) { 
 
    obj.attachEvent("on" + evt, fn); 
 
    } 
 
} 
 

 
// Exit intent trigger 
 
addEvent(document, 'mouseout', function(evt) { 
 
    if (evt.toElement == null && evt.relatedTarget == null && isPopped == false) { 
 
    $('.lightbox').slideDown(); 
 
    isPopped = true; 
 
    }; 
 
}); 
 

 
// Closing the Popup Box 
 
$(document).ready(function() { 
 
    $('#close').click(function() { 
 
    $('.lightbox').slideUp(); 
 
    }); 
 
});

.lightbox { 
 
    border: solid 1px #000; 
 
    padding: 50px; 
 
    position: absolute; 
 
    top: 50px; 
 
    left: 150px; 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="lightbox">Hello There 
 
<button id="close">Close Me</button></div>

Answer 2

Ich bin kein Experte in jQuery, aber die Lösung könnte so einfach sein wie das Erstellen einer Fenstervariablen.

definieren diese initally, außerhalb einer Funktion:

window.hasPoppedUp = false; 

Auf dem Popup-Code:

if(!window.hasPoppedUp) { 
    //do stuff 
    window.hasPoppedUp = true; 
}