Stop jogging on jQuery hover

I would like to create a small panel on the left side of the browser window that tracks the Y-position of the mouse and follows the mouse. Still no problem.

But now I would like to stop the div from shifting when the mouse hovering over the div to make it also possible to click on the content that the div just discovered.

I made a violin to clear up

http://jsfiddle.net/UXWp6/

<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script> $(document).bind('mousemove', function(e){ $('#blokje').offset({top: e.pageY-100}); }); </script> <style> #blokje{width:200px; height:200px; background:white; position:relative; left:-180px; color:black; } #blokje:hover{left:0;} #blokje #tit{position:absolute; width:30px; height:200px; background:black; right:0; top:0; } </style> </head> <body> <div id="blokje"> <div id="tit">&nbsp</div> <p><a href="#">A link</a><br /> This is the content where I would like to have my content clickable like that link on top </p> </div> </body> </html>โ€‹ 
0
source share
1 answer

Instead of actually connecting and unleashing events over and over again. I will probably just stop the distribution, so the document will never see that happen.

 $(function(){ $(document).bind('mousemove', function(e){ $('#blokje').offset({top: e.pageY-100}); }); $('#blokje').bind('mousemove', function(e){ e.stopPropagation(); }); }); 

Fiddler

+1
source

All Articles