Create a simple automatic image switcher using jQuery
- by Kim Andersen
Hi all.
I need to create a very simple image switcher that changes my images automatically. I have the following code:
<div class="imgCarousel">
<div class="imgC1 left"><img src="/media/1614/1_1.jpg" alt="img1" /></div>
<div class="imgC2 left"><img src="/media/1615/2_1.jpg" alt="img2" /></div>
<div class="imgC3 left"><img src="/media/1616/3_1.gif" alt="img3" /></div>
<div class="imgC4 left"><img src="/media/1617/4_1.jpg" alt="img4" /></div>
<div class="imgC5 left"><img src="/media/1618/5_1.jpg" alt="img5a" /></div>
<div class="imgC6 left"><img src="/media/1620/6_1.jpg" alt="img6a" /></div>
<div class="imgC7 left"><img src="/media/1622/7.jpg" alt="img7" /></div>
</div>
Two of the above images should be switched automatically after a certain amount of time (every 3-4 sec.).
This means that after 4 seconds, I'd like to change the image called /media/1618/5_1.jpg with another image. And after another 4 seconds, I'd switch back again. The same shold be made for one of my other images. How can I acomplish this with some jQuery?