jquery - How to lower opacity for everything but the hover in a div -


i have group of images inside div , want divs opacity @ 30% when hover on have image being hovered on stay @ 100%. here example of looking http://www.rickanddrew.com/photography/ appreciate can get.

this should work:

$('.images').hover(function() {     $(this).stop().animate({         opacity: 1     }).siblings().stop().animate({         opacity: 0.3     }); }, function() {     $(this).siblings().stop().animate({         opacity: 1     }); }); 

although i'd css , use transitions progressively make animation better-looking on browsers support css3 transitions:

.img-container {     -webkit-transition: opacity 0.3s;     -moz-transition: opacity 0.3s;     -ms-transition: opacity 0.3s;     -o-transition: opacity 0.3s;     transition: opacity 0.3s; }  #parent:hover > .img-container:not(:hover) {     opacity: 0.3; } 

demo: http://jsfiddle.net/bzg6t/


Comments

Popular posts from this blog

node.js - Bad Request - node js ajax post -

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -