hover - How can I ignore all children elements with JQuery -

i've code:

$('.div2').mousemove(function(e) {     var posx = (50 - (e.offsetx) / $(this).width() * 100);     var posy = (-50 + (e.offsety) / $(this).height() * 100);     $('.results').html(posx+', '+posy); }); 

and html:

<div class="div1">   <div class="div2">     <ul>       <li>item 1</li>       <li>item 2</li>       <li>item 3</li>     </ul>   </div> </div> <div class="results"></div> 

it works when mouser don't hover items... how can ignore them, getting right value?

i've tried:

if(e.target != this){     return true; } 

but don't right value on items...

welcome stack overflow!

use event attributes layerx , layery desired values. offsetx , offsety attributes relative element below cursor, though event bound parent. same applies target attribute.

also, prefer using currenttarget since makes code bit easier read , understand without having trace origin of this.

$('.div2').mousemove(function(e) {     var posx = (50 - (e.layerx) / $(e.currenttarget).width() * 100);     var posy = (-50 + (e.layery) / $(e.currenttarget).height() * 100);     $('.results').html(posx+', '+posy); }); 

check out test case on jsfiddle