css - CSS3 hover on nested divs -


i have mutlilevel nested divs. each div has span in it.

<div>     <span>aa</span>     <div>         <span>bb</span>         <div>             <span>cc</span>         </div>     </div> </div> 

if hover div, spans css should background. works pretty well, long hover outer div, containting aa span. problem is, if hover middle div, containing bb span, outer div hovers well. if hover cc span div 3 spans background.

what want is, 1 div mouse points @ hovered. preferably css solution, jquery great well.

here simplified jsfiddle of problem: http://jsfiddle.net/fufrg/

in jquery easy. stop propagation. jsfiddle

$("div").on("mouseover",function(e){     $(this).children("span").css("background","#aaa");     e.stoppropagation(); }); $("div").on("mouseout",function(){     $(this).children("span").css("background",""); }); 

Comments

Popular posts from this blog

jquery - How can I dynamically add a browser tab? -

node.js - Getting the socket id,user id pair of a logged in user(s) -

keyboard - C++ GetAsyncKeyState alternative -