Question

我使用JQuery滑块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可以很好地解决我的问题。

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

Cycle2计算幻灯片中的误差

1 个答案: