Jquery :not()selector

Posted by kim on Stack Overflow See other posts from Stack Overflow or by kim
Published on 2010-05-05T14:48:36Z Indexed on 2010/05/05 14:58 UTC
Read the original article Hit count: 186

Filed under:
|
<html lang="en">
<head>
<style>
#thisdiv {padding:10px; margin:-15px 0 0 40px; background-color:#333; position:absolute; display:none;}
div.block {margin-top:10px; width:200px;}
div#thisdiv a {color:#fff;}
</style>
</head>
<body>

<div id ="one" class="block"><a href="">one</a></div>
 <div id="thisdiv">hello</div>
<div id ="two"class="block">two</div>
<div id ="three"class="block">three/div>


<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
  $('#one').hover(function() {
   $('#thisdiv').fadeIn(400);
  }); 

  $('div:not(#thisdiv)').mouseleave(function() {
   $('#thisdiv').fadeOut(400) 
  });
});
</script>
</body>
</html>

#thisdiv doesn't fadeOut. I could have used the following, but it only fades out if the cursor mouse outs of #thisdiv. Is there any way i can solve this so when the cursor navigates away from anyway, the div still fade out.

$('#thisdiv').mouseleave(function() {
   $('#thisdiv').fadeOut(400) 
  });

I couldn't figure out what's why jquery's :not selector is not doing what I wanted to. Am i using it wrongly?

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about JavaScript