jQuery:在视口(viewport)中居中 fancybox

Question

我目前正在使用 fancybox 版本 2 在单击缩略图时显示我的图像，但我似乎无法让 fancybox 位于视口(viewport)的中间，垂直方向来说，因为水平方向没问题。

我已经尝试了很多东西，这是最新的:

CSS

.fancybox-wrap { 
    position: fixed !important;
    top: 50px !important;
} 

jQuery

jQuery(document).ready(function() {
    $(".fancybox-wrap").css("position", "absolute");

    // fancybox initialisation etc

});


$(window).scroll(function() {
    $('.fancybox-wrap').css('top', $(this).scrollTop() + "50px");
});

有没有人有什么想法？

Answer 1

你唯一需要做的就是添加到网站的CSS

html, body {height: 100%;}

并且fancybox会将图像定位在屏幕中心而不是页面中心。