Tell me please! How to launch a modal window not by clicking on a link, but when the page loads?

HTML:

<a href="#dialog" name="modal">Открыть модальное окно</a> <div id="boxes"> <div id="dialog" class="window"> Простое модальное окно <br> <span><a href="#" class="close"/>Закрыть его</a> </div> <div id="mask"></div> </div>

Javascript:

 <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script> <script> $(document).ready(function() { $('a[name=modal]').click(function(e) { e.preventDefault(); var id = $(this).attr('href'); var maskHeight = $(document).height(); var maskWidth = $(window).width(); $('#mask').css({'width':maskWidth,'height':maskHeight}); $('#mask').fadeIn(1000); $('#mask').fadeTo("slow",0.8); var winH = $(window).height(); var winW = $(window).width(); $(id).css('top', winH/2-$(id).height()/2); $(id).css('left', winW/2-$(id).width()/2); $(id).fadeIn(2000); }); $('.window .close').click(function (e) { e.preventDefault(); $('#mask, .window').hide(); }); $('#mask').click(function () { $(this).hide(); $('.window').hide(); }); }); </script>

    1 answer 1

    Throw the opening of a modal window into a function and call it at the right moment: by loading, by clicking, etc. It can be done like this.

     function modalWin(id){ var maskHeight = $(document).height(); var maskWidth = $(window).width(); $('#mask').css({'width':maskWidth,'height':maskHeight}); $('#mask').fadeIn(1000); $('#mask').fadeTo("slow",0.8); var winH = $(window).height(); var winW = $(window).width(); $(id).css('top', winH/2-$(id).height()/2); $(id).css('left', winW/2-$(id).width()/2); $(id).fadeIn(2000); } $(document).ready(function() { $('a[name=modal]').click(function(e) { e.preventDefault(); var id = $(this).attr('href'); modalWin(id); // вызываем по клику }); $('.window .close').click(function (e) { e.preventDefault(); $('#mask, .window').hide(); }); $('#mask').click(function () { $(this).hide(); $('.window').hide(); }); }); modalWin('#dialog'); // вызываем после загрузки
    • Thank you :) - archisova
    • And you can still ask a question :) And how to make sure that after closing this window, a person with this session already when updating this page does not receive this message? - archisova
    • You can use cookies. For jQuery there is a corresponding plugin . By reference can find and info how to use it - Deonis
    • Thank you :) Good man! You're probably the only one supporting me here :) My questions are all minus :( - archisova