35 Comments

Speak your mind
  1. For of you, who want cookie-enabled. Just do this:

    Put this file in your js-directory:
    https://github.com/carhartl/jquery-cookie/blob/master/jquery.cookie.js

    Next:
    go to your init.js

    replace the mouseover and launch modal box code, with this code:

    $(document).mousemove(function(e) {
    if(e.pageY <= 5) {

    if ($.cookie(‘exit_modal’) != ‘1’) {
    // Launch MODAL BOX
    $(‘#exit_content’).modal({onOpen: modalOpen, onClose: simplemodal_close});
    //code to display popup
    $.cookie(‘exit_modal’, ‘1’, { expires: 30 });
    }

    }
    });

  2. Great script but not working in IE9 which is a great shame as unfortunately this is the main browser

  3. it does not work in ie8. my ie version is: 8.0.7
    please do something in code that it would work in ie all versions also. you can see this is problem in this otherwise it is best script.

    • To do this you could use PHP Sessions. Once the Exit Modal Box is launched, a sessions is registered. Future launch attempts (in the same browser session) should be blocked if the initial session is registered.

  4. $.modal.close();
    is working only once…………..
    for the second time it is not closing the model box by clicking on it…..
    plz help me…………..

  5. @Digof, @Victor: I’ve tested the script in IE 8.0.6 and it works fine! What versions are you using?

    @Clare: Which version of FireFox are you using? It’s the first browser that I used to test the script and it worked fine.

  6. so this is nice but i’ve done something before myself and ran into an issue that appears you have as well… the issue is this. when you have a page that scrolls, if the user scrolls down your page more than 5 pixels [i.e. if(e.pageY <= 5)] then when the mouse leaves the area there's no trigger. the solution you ask? just subtract .scrollTop() in the math. [if(e.pageY-$(document).scrollTop() <= 5)]

    this helps if your page is long enough to scroll. there are however two more obstacles. one is that if the user moves the mouse fast enough the event is not triggered. also, if a users mouse is outside of the document on page load the event could be triggered when they move the mouse INTO the document from the address bar to click on a link. it's a tough one i've though about for some time now.. ๐Ÿ˜›

    • This code works perfect for me, thanks for fixing the scroll page problem. Can anyone help me with code to make this pop-up appear only once if the person has been to the site before?

      • You can use (PHP) cookies to check if the user has already visited your website. Set a cookie with a specific value the first time he opens the web page. When he returns, check if the cookie is already set. If it is, do not include the “Exit Modal Box” ๐Ÿ˜‰

        • Can you give the full source of that php function ? We are just websites owners, not developers or programmers… ๐Ÿ™

  7. Hi,
    Thank you for creating this tutorial. I imoplemenetd it on my site, but had an issue because it appears behind the flash video in Windows but works perfectly on my Mac… Is there a way to ensure that the modal box always appears on top?
    Thanks,
    Victoria

      • should just be a z-index issue. and possibly an issue with the flash embed params. you should be sure to set the window mode to transparent. () googling that and css z-index should resolve your issues.

  8. This is a very handy script! It there any way to add a cookie so that the user won’t get prompt each time that they come back to the site?

  9. Really easy to implement and just what I was looking for.

    How would I go one step further and only display the box once so that when someone has seen the message, it doesn’t display again when they go to browse another site.

    I was looking into using the ‘one’ function but having difficulty getting to work.

    Thanks.

Trackbacks

  1. […] Creating an Exit Modal Box using jQuery Do you need to show a specific message to the visitors that leave your website? You can do that by initiating a modal box before they close the browser window. To do this we need to include 2 JQuery files (the actual library and a plugin written by Eric Martin), the modal boxโ€™s CSS and the file that triggers the modal box based on the userโ€™s action. […]

  2. […] Creating an Exit Modal Box using jQuery Do you need to show a specific message to the visitors that leave your website? You can do that by initiating a modal box before they close the browser window. To do this we need to include 2 JQuery files (the actual library and a plugin written by Eric Martin), the modal boxโ€™s CSS and the file that triggers the modal box based on the userโ€™s action. […]

Leave a Reply

Your email address will not be published. Required fields are marked *

Share This