Question

我的Slimbox插件存在问题。当我点击图像时，图像在底页加载，需要滚动页面才能看到图像。

但在页面中心的演示图像加载

Answer 1

css style

#lbImage {
        position: absolute;
        left: 0;
        top: 0;
        border: 10px solid #fff;
        background-repeat: no-repeat;
    }

#lbOverlay {
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    cursor: pointer;
}

#lbCenter, #lbBottomContainer {
   z-index: 9999999999;
   position: fixed;
   left: 50%;
   background-color: #fff;
   top: 30px !important; 
}

对我有用

Answer 2

打开缩小的slimbox2.js并找到代码：

y=E.scrollTop()+(E.height()/2);

（它应位于第1100栏附近）并用

替换它

y=E.scrollTop()+(window.innerHeight()/2);

注意：变量名称可能不同（它们由minifier随机选择）。您可能想要搜索“.height（）/ 2”作为开始。

代码计算窗口的垂直中心位置。发生错误是因为jQuery $（window）.height属性在某些情况下在jQuery的后续版本中返回错误的值，这导致该框出现在窗口底部附近，甚至在底部。

我在网上找到的这个jQuery错误的一些解决方案包括在HTML文件的开头指定，但这对我不起作用。

通过window.innerHeight的简单JavaScript解决方案解决了大多数现代浏览器的问题，但不适用于IE 8及更早版本。

如何在页面中心加载图像 - slimbox

2 个答案: