javascript - Cycle2 计算幻灯片中的错误边距

Question

我使用 JQuery slider Cycle2将图像水平和垂直居中(在 http://www.kadirkara.de/gs 上测试)。

在某些时候，插件会计算错误的边距，将图像带到页面的右下角。

我的 HTML:

<div class="cycle-slideshow" data-cycle-fx=fadeOut data-cycle-timeout=500 data-cycle-speed=200 data-cycle-center-horz=true data-cycle-center-vert=true>
    <img src="images/Gregor_Szinyai_Haus_Auwaeter_01.jpg" alt="">
    <img src="images/Gregor_Szinyai_Haus_Auwaeter_02.jpg" alt="">
    <img src="images/Gregor_Szinyai_Haus_Auwaeter_03.jpg" alt="">
    <img src="images/Gregor_Szinyai_Haus_Auwaeter_04.jpg" alt="">
    <img src="images/Gregor_Szinyai_Haus_Auwaeter_05.jpg" alt="">
</div>

我的 CSS:

.cycle-slideshow { 
width: 80%;
margin: 1.2em auto !important;
}

.cycle-slideshow img {
max-width: 100% !important;
}

我不知道，但我认为问题可能出在 center.min.jsm 的某个地方，但不幸的是，我对 Javascript 不是很熟练。

function r() {
    var i = e(this),
        n = t.container.width(),
        s = t.container.height(),
        o = i.outerWidth(),
        l = i.outerHeight();
    t.centerHorz && n >= o && i.css("marginLeft", (n - o) / 2), t.centerVert && s >= l && i.css("marginTop", (s - l) / 2)
}
if (t.centerHorz || t.centerVert) {
    var c, a;
    e(window).on("resize orientationchange", n), t.container.on("cycle-destroyed", s), t.container.on("cycle-initialized cycle-slide-added cycle-slide-removed", function () {
        n()
    }), l()
}

Answer 1

好的，似乎添加了 progressive image load很好地解决了我的问题。

如果有人提出同样的问题。