Cycle2在加载

Question

我已经看到了解决这个问题的一些尝试，但我无法让它们发挥作用。

我正在使用这样的cycle2：

<div id="slideShow" class="cycle-slideshow" data-cycle-slides="> div.slides" data-cycle-prev="#slideShowPrev" data-cycle-next="#slideShowNext">

效果很好，但在加载时会显示彼此之下的所有幻灯片。

我已尝试过在cycle2网站上建议的解决方案：

#slideshow img, #slideshow div { display: none }
#slideshow img.first { display: block }

但遗憾的是，这似乎不起作用。

有没有人有这方面的简单解决方案？

Answer 1

我认为这就是你所需要的：

.slides {display: none;}
.slides.cycle-slide {display: block;}

这会隐藏你的幻灯片，直到加载插件并开始魔术。 在你的CSS中，你将一个显示块添加到一个隐藏div的图像子项;如果你想显示第一张幻灯片，直到插件的哨兵开始，你可以这样做：

.slides {display: none;}
.slides:first-child, .slides.cycle-slide {display: block;}