Simple Modal Window + jQuery Cookie -
i use plugin jquery simple modal window display modal window. use jquery cookie plugin (jquery.cookie.js) set cookies. how can mix jquery simple modal window , jquery cookie? it`s necessary after clicking on "continue" button, cookies set , modal window in future doesnt appear users. i'm sorry, i'm beginner.
this code:
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.cookie.js"></script> <script type="text/javascript"> $(document).ready(function() { //put in div id want display launchwindow('#alert'); //if close button clicked $('.window .close').click(function (e) { $('#mask').hide(); $('.window').hide(); }); }); //if close button clicked $('.window .close').click(function (e) { //cancel link behavior e.preventdefault(); $('#mask').hide(); $('.window').hide(); }); //if mask clicked $('#mask').click(function () { $(this).hide(); $('.window').hide(); }); function launchwindow(id) { //get screen height , width var maskheight = $(document).height(); var maskwidth = $(window).width(); //set heigth , width mask fill whole screen $('#mask').css({'width':maskwidth,'height':maskheight}); //transition effect $('#mask').fadein(1000); $('#mask').fadeto("slow",0.95); //get window height , width var winh = $(window).height(); var winw = $(window).width(); //set popup window center $(id).css('top', winh/2-$(id).height()/2); $(id).css('left', winw/2-$(id).width()/2); //transition effect $(id).fadein(2000); } </script> <script type="text/javascript"> $(function() { $('#button').click(function(e) { $.cookie('the_cookie', '1', { expires: 999 }); }); }); </script> </head> <body> <!-- start alert block --> <div id='boxes'> <div id='alert' class='window'> text... <input type="button" id="button" value="" class='close warn_buttons'/> </div> <!-- mask --> <div id='mask'></div> </div> <!-- end alert block --> </body> </html>
don't call launchwindow() if cookie set.
if(!$.cookie('the_cookie')){ launchwindow('#alert'); }
Comments
Post a Comment