根据图像数量为JavaScript计时器循环设置计数器(Set up a counter for a JavaScript timer loop based on number of images)
我想要做的是设置每个BannerImg元素显示:使用计时器设置一次一个。 然后,一旦我循环遍历所有BannerImg元素,我想重置它们以显示:block。 它基本上就像我正在尝试制作的图像旋转器......但是现在,我不确定如何一次一个地定位每个BannerImg元素 - 我一次瞄准它们,这不是我的意思想做。
jQuery.noConflict(); (function($) { $(document).ready(function() { var BannerCount = $('BannerImg').length; var intervalID = window.setInterval(function() { $('.BannerImg').toggleClass("HideBannerImg"); }, 2000); }); }(jQuery));What I would like to do is set each BannerImg element to display: none one at a time using a timer setup. Then, once I have looped through all BannerImg elements, I want to reset them to display: block. It's basically like a image rotator that I'm trying to make...but right now, I'm not sure how to target each BannerImg element one at a time--I am targeting them all at once, which is not what I want to do.
jQuery.noConflict(); (function($) { $(document).ready(function() { var BannerCount = $('BannerImg').length; var intervalID = window.setInterval(function() { $('.BannerImg').toggleClass("HideBannerImg"); }, 2000); }); }(jQuery));最满意答案
使用.eq(index) 。 您可能希望缓存您的集合以使其更快:
(function($) { $(document).ready(function() { var $banners = $('.BannerImg'); var index = 0; var intervalID = window.setInterval(function() { $banners.eq(index).toggleClass("HideBannerImg"); index++; // Check to see if we've hit the end of the collection // If so, stop the interval. if (index === $banners.length) { clearInterval(intervalID); } }, 2000); }); }(jQuery));Use .eq(index). You'll probably want to cache your collection to make it faster:
(function($) { $(document).ready(function() { var $banners = $('.BannerImg'); var index = 0; var intervalID = window.setInterval(function() { $banners.eq(index).toggleClass("HideBannerImg"); index++; // Check to see if we've hit the end of the collection // If so, stop the interval. if (index === $banners.length) { clearInterval(intervalID); } }, 2000); }); }(jQuery));更多推荐
发布评论