javascript - jQuery cycle image that are display: none -
i have div contains several images , there's default image. @ beginning displays default image, whenever user mouses hover
image should cycle other images display: none
.
as can see in jsfiddle, div structure following:
<div id="2"> <img src="http://www.thesearchagents.com/wp-content/uploads/2013/11/google-search.jpg" class="default" onmouseout="this.src='http://www.thesearchagents.com/wp-content/uploads/2013/11/google-search.jpg'"/> <img src="http://pplware.sapo.pt/wp-content/uploads/2014/02/google_whatsapp.jpg" class="default" style="display: none"/> <img src="http://pplware.sapo.pt/wp-content/uploads/2013/07/google_08.jpg" class="default" style="display: none"/> </div>
the first image, default 1 because has event onmouseout
. other images complement div. so, want whenever user mouseshover
image default cycle begin between 3 (in case) images.
one of doubts way i'm output images..i don't know if there's better approach.
finally, output like this.
well, i've solved problem cycle2 plugin.
$('.slideshow').cycle({ fx: 'fade', speed: 600, timeout: 300, pause: 0 });
Comments
Post a Comment