0

它非常烦人,让我失去理智。我一生都无法弄清楚为什么会这样。

这是链接

我正在为滑块使用ResponsiveSlides插件 - 我会假设一旦它到达幻灯片的末尾,它就会重复回到第一张幻灯片。

相反,它似乎到达幻灯片的结尾,然后显示一张空白幻灯片,然后重复回到第一张幻灯片。

当我尝试使用 Orbit 滑块时,也会出现同样的效果。并且当我尝试使用另一个滑块时。

我确信这不是滑块插件的错(我怀疑所有 3 个滑块插件都会在幻灯片结束时随机显示一张空白幻灯片)。

我想过/尝试过的事情: - 认为其中一张图像可能被破坏了......不。这是我的标记:

<!-- begin slider -->
<div class="slider">
    <ul class="rslides">
        <li><img class="slider-image" src="images/slider1.jpg" alt="Slider Picture 1 - Kilmarnock by the Sea" id="slider1"></li>
        <li><img class="slider-image" src="images/slider2.jpg" alt="Slider Picture 2 - Kilmarnock by the Sea" id="slider2"></li>
        <li><img class="slider-image" src="images/slider3.jpg" alt="Slider Picture 3 - Kilmarnock by the Sea" id="slider3"></li>
        <li><img class="slider-image" src="images/slider4.jpg" alt="Slider Picture 4 - Kilmarnock by the Sea" id="slider4"></li>
        <li><img class="slider-image" src="images/slider5.jpg" alt="Slider Picture 5 - Kilmarnock by the Sea" id="slider5"></li>
        <li><img class="slider-image" src="images/slider6.jpg" alt="Slider Picture 6 - Kilmarnock by the Sea" id="slider6"></li>
        <li><img class="slider-image" src="images/slider7.jpg" alt="Slider Picture 7 - Kilmarnock by the Sea" id="slider7"></li>
    <li>
</div>
<!-- end slider -->

还有我的 JavaScript:

$(function() {
    $('.rslides').responsiveSlides({
        auto: true,
        speed: 500,
        random: true,
        timeout: 2500
    });
});

这些图像中的每一个都存在于服务器上,并且控制台中没有 404,就好像我正在尝试访问一个不存在的图像......但是:滑块仍然显示一张空白幻灯片!

有人知道吗?

4

1 回答 1

2

你写<li>的不是</ul>. 这会被解析为一个额外的列表元素,你会得到一张额外的空幻灯片。

于 2013-07-23T15:21:43.953 回答