javascript - Manipulating Images in Array to fadein and out on hover via Jquery -
i trying reference array of images , everytime user hovers on image in array, image fades in. image fades out when user's mouse leaves image.
the code have written below not seem work. please
var imagearray=[document.getelementbyid("one"),document.getelementbyid("two"),document.getelementbyid("three")] $.each(imagrarray,function(){ $.hover(function(){ $.fadein("slow");},function(){ $.fadeout(); }); });
html below:
<div id="faces" style=" overflow-y:hidden; height:120px; display:inline-block; left: 20px ; position:relative; opacity:0.5" > <div id="base" class="hidden" > <li class=set1" style="display:inline;"> <img id="one" style="float:left" src="attachments/36508133/one.png?api=v2" height="100"width="52" /> <img id="two" style="float:left" src="attachments/36508133/two.png?api=v2" height="100"width="52"/> <img id="three" style="float:left" src="attachments/36508133/three.png?api=v2" height="100" width="52"/> </li></div></div>
problem you're not applying hover anything.
the $.each callback has 2 arguments, index of iteration on given array , array item @ given index. need pass hover. so...
$.each(imagrarray,function(index, item){ $(item).hover(function(){ $(this).fadein("slow");},function(){ $(this).fadeout(); }); });
also, weren't applying fadein/out either. in case, this refers element returned $(item).
that said, code refactored can see in arun's jsfiddle.
Comments
Post a Comment