我已经构建了一个 JQuery CSS3 图像库。问题是下面代码中的下一个函数无法正常工作。
function gallery() {
var islide = $('.cornerimg:visible');
$(islide).removeClass('cornerimgfocus');
$(islide).next().addClass('cornerimgfocus');
setTimeout(function() {
gallery()
},4000);
}
$(window).load(function() {
$( '.cornerimg' ).first().addClass('cornerimgfocus');
setTimeout(function() {
gallery()
},4000);
});
下一个函数对所有下一个元素进行操作,而不仅仅是下一个元素。结果是第一个 .cornerimg 类之后的所有元素都立即变得可见。
HTML
<div class="imageitem">
<div class="cornerimg" style="background-image:url(http://www.golfbrowser.com/wp-content/uploads/2011/05/DSC00764s-968x400.jpg);"></div>
<div class="cornerimg" style="background-image:url(http://www.golfbrowser.com/wp-content/uploads/2011/05/DSC00762s-968x400.jpg);"></div>
<div class="cornerimg" style="background-image:url(http://www.golfbrowser.com/wp-content/uploads/2011/05/DSC00759s-968x400.jpg);"></div>
</div>
有什么想法吗?
太棒了
最佳答案
.next()
选择集合中每个元素之后的下一个元素。
如果集合有 n 个元素,.next()
也将有 n 个元素。
您可能需要.first().next()
或.eq(1)
。
关于JQuery .next() 函数获取所有下一个元素而不是一个,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6469764/