0

基本上我制作了一个弹出窗口并将其放置在页面顶部，效果很好，但这显然不适用于底部的页脚链接，因为它只是显示在顶部。

无论在哪里按下链接，我都希望能够让它在中心弹出，我希望这是有道理的。

我已经尝试在互联网上搜索有关如何解决此问题的任何有用的教程。

所以我求助于 Stackoverflow 的力量。

视觉： http: //madaxedesign.co.uk/

查询：

    $('a.contact , a.contact_footer, a.contact_text').click(function() {
    $("#popup").load("contact.php");
    // Getting the variable's value from a link
    var 
    show = $('#popup').css('display', 'block'),
    popup = $(this).attr('href');

    //Fade in the Popup and add close button
    $(popup).fadeIn(300);

    //Set the center alignment padding + border
    var popMargTop = ($(popup).height() + 24) / 2; 
    var popMargLeft = ($(popup).width() + 24) / 2; 

    $(popup).css({ 
        'margin-top' : -popMargTop,
        'margin-left' : -popMargLeft
    });

    // Add the mask to body
    $('body').append('<div id="mask"></div>');
    $('#mask').fadeIn(300);

    return false;
});

// When clicking on the button close or the mask layer the popup closed
$('a.cross, #mask').live('click', function() { 
  $('#mask , #popup').fadeOut(300 , function() {
    $('#mask').remove();  
}); 
return false;
});

如果您需要更多信息，请询问。

4

3 回答 3

0

这是我用于这种情况的一些代码，我已将其修改为与您的代码相似：

var view_width = $(window).width();
var view_top = $(window).scrollTop() + 70;

// Move the lightbox to the middle of the screen.
$( popup ).css("left", (view_width - $( popup ).width() ) / 2 );
// Make sure the window is in view no matter where you are on the page
$( popup ).css("top", view_top);
于 2013-04-24T20:00:46.863 回答
0

为了在页面中心或元素中显示图像，我使用以下 css 代码：

.element{position:absolute; display:block; margin:auto; top:0; bottom:0; left:0; right:0;}

顺便说一句，如果您查看单个图像文件，那与 firefox 使用的代码相同。我认为这也应该适用于弹出窗口。

于 2013-04-24T20:03:09.157 回答
0

我发现实际显示弹出菜单的最佳方式是按位置：固定。然后，您可以将菜单放置在页面上的任何位置，并且在您退出之前它永远不会移动（无论滚动位置如何）。关闭菜单后，只需将其改回显示：块。

于 2013-04-24T20:10:24.820 回答