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"> </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>โ
source share