First block here.

Another block here.

How to disable snapping on div

Suppose I have this HTML:

<body> <div id="topbar"> First block here. <p>Another block here.</p> </div> <div class="header"> <div class="container"></div> </div> <div id="footer">Footer</div> </body> 

How to disable bind on div#topbar ?

 $('body').bind('mouseover mouseout', function(event) { }); 

I already tried this without success:

 if($(event.target).is('#topbar')) { //do nothing } else { //do stuff } 

Actually, my problem is that if I do the cursor on the p tag, the code does not work.

PS: I have no control over HTML, so I have to use a common tag, for example body .

Thanks.

+5
source share
1 answer

Try creating another div for the rest of the body:

 <body> <div id="topbar">hello <div>How<br>are<br>you<br>today<br>?</div> </div> <div id="mouseEvent"> <div class="header"> <div class="container"></div> </div> <div id="footer">Footer</div> </div> </body> 

and js:

 $('body').bind('mouseover mouseout', function(event) { var list = $('#topbar').find( "*" ); if($(event.target).is("#topbar") || $(event.target).is(list)) { alert("hello"); } else { alert("footer"); } }); 

Updated: JSFiddle

0
source

All Articles