0

我有这个模态代码，但它只在单击分配给这个模态的按钮时出现。

我希望我的模态与页面一起自动加载，而无需单击任何按钮。

我将如何做到这一点？

jQuery(document).ready(function() { 

//select all the a tag with name equal to modal
jQuery('a[name=account]').click(function(e) {
    //Cancel the link behavior
    e.preventDefault();

    //Get the A tag
    var id = jQuery(this).attr('href');

    //Get the screen height and width
    var maskHeight = jQuery(document).height();
    var maskWidth = jQuery(window).width();

    //Set heigth and width to mask to fill up the whole screen
    jQuery('#mask').css({'width':maskWidth,'height':maskHeight});

    //transition effect     
    jQuery('#mask').fadeIn(400);    
    jQuery('#mask').fadeTo(400,0.8);    

    //Get the window height and width
    var winH = jQuery(window).height();
    var winW = jQuery(window).width();

    //Set the popup window to center
    jQuery(id).css('top',  winH/2-jQuery(id).height()/2);
    jQuery(id).css('left', winW/2-jQuery(id).width()/2);

    //transition effect
    jQuery(id).fadeIn(400); 

});

//if close button is clicked
jQuery('.window .close').click(function (e) {
    //Cancel the link behavior
    e.preventDefault();

    jQuery('#mask').hide();
    jQuery('.window').hide();
});     


jQuery(window).resize(function () {

    var box = jQuery('#boxes .window');

    //Get the screen height and width
    var maskHeight = jQuery(document).height();
    var maskWidth = jQuery(window).width();

    //Set height and width to mask to fill up the whole screen
    jQuery('#mask').css({'width':maskWidth,'height':maskHeight});

    //Get the window height and width
    var winH = jQuery(window).height();
    var winW = jQuery(window).width();

    //Set the popup window to center
    box.css('top',  winH/2 - box.height()/2);
    box.css('left', winW/2 - box.width()/2);

});
});
4

2 回答 2

2

像这样

function pop(id) {

    //Get the screen height and width
    var maskHeight = jQuery(document).height();
    var maskWidth = jQuery(window).width();

    //Set heigth and width to mask to fill up the whole screen
    jQuery('#mask').css({'width':maskWidth,'height':maskHeight});

    //transition effect     
    jQuery('#mask').fadeIn(400);    
    jQuery('#mask').fadeTo(400,0.8);    

    //Get the window height and width
    var winH = jQuery(window).height();
    var winW = jQuery(window).width();

    //Set the popup window to center
    jQuery(id).css('top',  winH/2-jQuery(id).height()/2);
    jQuery(id).css('left', winW/2-jQuery(id).width()/2);

    //transition effect
    jQuery(id).fadeIn(400); 

}

jQuery(document).ready(function() { 
    pop("some ID"); 
    //select all the a tag with name equal to modal
    jQuery('a[name=account]').click(function(e) {
      //Cancel the link behavior
      e.preventDefault();

      //Get the A tag
      var id = jQuery(this).attr('href');
      pop(id);

    });
.
.
.
于 2012-12-07T08:29:03.973 回答
0

您可以将其放在函数处理程序jQuery('a[name=account]').trigger('click')的末尾。.ready但请注意，使用选择器之类的'a[name=account]'click 将在所有设备上触发<a name="account"，这可能会导致出现多个模式窗口。或者a会出现最后一个弹出窗口。可能您需要为某些设置一个 id，<a>以便仅调用该弹出窗口<a>

jQuery(document).ready(function() { 

//select all the a tag with name equal to modal
jQuery('a[name=account]').click(function(e) {
     ....    
});

//if close button is clicked
jQuery('.window .close').click(function (e) {
    .....
});     


jQuery(window).resize(function () {

    ....

});
jQuery('a[name=account]').trigger('click');
});
于 2012-12-07T08:27:11.003 回答