[jQuery] hover + inside elements
Hi,
I have a layout with 4 collumn divs. When the mouse hovers over each
collumn, a simple fadein is performed on another element.
Now what happens is, when i move over another element INSIDE a collumn
div (a <h2> for instance), the same fadein runs again... Am I doing
something wrong with the selectors ?
Here's a piece of code:
$(document).ready(function() {
var sectionSpeed = 250;
$("#section-c").hover(
function() {
$("#icon-c").fadeIn(sectionSpeed);
},
function() {
$("#icon-c").fadeOut(sectionSpeed);
}
);
});
html structure looks like this:
<div id="section-y"><h2>main log</h2></div>
<div id="section-k"><h2>mobileme log</h2></div>
<div id="section-m"><h2>flickr log</h2></div>
<div id="section-c"><h2>twitter log</h2></div>
<div id="icon">
<div id="icon-c"></div>
<div id="icon-m"></div>
<div id="icon-y"></div>
<div id="icon-k"></div>
</div>
Thank yous.