JQuery - making a list 3 or more img toggles go to their default image when one of them is toggled via click event -


here's jsfiddle.

i can 2 divs toggle , have other div reset it's original img, can't 3 or more divs. i'm doing wrong eq methods, not sure what.

html:

<div class="home">     <img src="http://www.misfitpsycles.com/blog/wp-content/uploads/2011/09/red-circle.jpg">     <img style="display:none;" src="http://tribute.dbclay.com/img/badjorx/black-circle.jpg"> </div> <div class="myplayer">     <img src="http://upload.wikimedia.org/wikipedia/commons/d/d5/blue_circle_o.jpg">     <img style="display:none;" src="http://i00.i.aliimg.com/img/pb/301/829/308/308829301_525.jpg"> </div> <div class="mycareer">     <img src="http://farm3.staticflickr.com/2226/1667080567_172c7871d3.jpg">     <img style="display:none;" src="http://www.venatu.com/images/ge/purple-circle.png"> </div> 

jquery:

$('div').click(function(){     $(this).find('img:hidden').addclass('tofadein');     $(this).find('img:visible').addclass('tofadeout');     $(this).find('img.tofadein').fadein();     $(this).find('img.tofadeout').fadeout();     $(this).find('img').removeclass();        $(this).siblings('div').find('img').eq(0).fadein();     $(this).siblings('div').find('img').eq(1).fadeout();     $(this).siblings('div').find('img').eq(2).fadeout(); }); 

i think fiddle accomplishes you're trying do:

jsfiddle

basically key add each function doing every sibling. removed div siblings function because isn't necessary in example. may still need in actual code. lastly, no .eq(2) exists. guessing experimenting one.

heres new js

$('div').click(function(){     $(this).find('img:hidden').addclass('tofadein');     $(this).find('img:visible').addclass('tofadeout');     $(this).find('img.tofadein').fadein();     $(this).find('img.tofadeout').fadeout();     $(this).find('img').removeclass('tofadein').removeclass('tofadeout');      $(this).siblings().each(function(){         $(this).find('img').eq(0).fadein();         $(this).find('img').eq(1).fadeout();     }); }); 

Comments

Popular posts from this blog

css - Which browser returns the correct result for getBoundingClientRect of an SVG element? -

gcc - Calling fftR4() in c from assembly -

.htaccess - Matching full URL in RewriteCond -