如何在页面加载时加载弹出窗口

时间:2012-12-23 08:19:33

标签: jquery popup modal-dialog pageload

我有一个脚本,可以在点击时加载弹出窗口。 是否可以在页面加载时自动加载弹出窗口? 这是代码:

<!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>A Simple Lightweight jQuery Modal Popup Box.</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<link href="modalPopLite.css" rel="stylesheet" type="text/css" />
<script src="modalPopLite.min.js" type="text/javascript"></script>

<style type="text/css">
    /* CSS Reset */
    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
        margin:0;
        padding:0;
        font-family: Verdana, Arial, "Lucida Grande", sans-serif;
    }        

    #clicker
    {
        font-size:20px;
        cursor:pointer;
    }
    #popup-wrapper
    {
        width:500px;
        height:300px;
        background-color:#ccc;
        padding:10px;

    }
    body
    {
        padding:10px;
    }
</style>


<script type="text/javascript">
    $(function () {

        $('#popup-wrapper').modalPopLite({ openButton: '#clicker', closeButton: '#close-btn', isModal: true });

    });
</script>

    </head>
     <body>    
<div id="clicker">
    Click Me!
</div>

<div id="popup-wrapper">
    I am a popup box. Content can be anything. <br />
    <a href="#" id="close-btn">Close</a>
</div>
</body>
</html>

完整代码位于http://www.mywebdeveloperblog.com/my-jquery-plugins/modalpoplite

有什么建议吗? :)

1 个答案:

答案 0 :(得分:-1)

该插件似乎没有按需显示弹出窗口的方法。因此,您必须模拟点击元素的点击:

$(function () {

    $('#popup-wrapper').modalPopLite({ openButton: '#clicker', closeButton: '#close-btn', isModal: true });

    $('#clicker').click(); /* Display popup */

});