我想在一页上制作几个(超过 12 个)幻灯片,这些幻灯片会在鼠标悬停时进行动画处理。现在只有第一个 div 是动画的。这是我的代码:
jQuery:
$(document).ready(function() {
$('#reference').each(function() {
$(this).cycle({
speed: 200,
//timeout: 0,
fx: 'fade',
});
});
});
HTML:
<div class="columns-3">
<div class="column firstCol">
<div class="columns-3-Content">
<div id="reference">
<img src="images/img1.png" />
<img src="images/img2.png" />
</div>
</div>
</div>
<div class="column">
<div class="columns-3-Content">
<div id="reference">
<img src="images/img1.png" />
<img src="images/img2.png" />
</div>
</div>
</div>
<div class="column lastCol">
<div class="columns-3-Content">
<div id="reference">
<img src="images/img1.png" />
<img src="images/img2.png" />
</div>
</div>
</div>
</div>
<div style="clear:both;"></div>
提前致谢!