Jump to content

Making Info Box Stick


Distortion
 Share

Recommended Posts

Ok I admit, I stole half of this code because of the browser support. This shows a box containing more info about the link you are about to click. I want this box to appear where the mouse was, but I don't want it to follow my mouse. The box pops up and goes away when the mouse leaves the box. Unfortunately the box either shows up at the top left of the page or follows my mouse. How do I set the mouse to be recorded once...This is what is in the body tags:

<div id="popbox" ONMOUSEOUT="kill()"></div><script type="text/javascript"><!--Xoffset=-120;Yoffset=-60;   var old,skn,iex=(document.all),yyy=-1000;var ns4=document.layersvar ns6=document.getElementById&&!document.allvar ie4=document.allvar show=0if (show==0) {document.onmousemove=get_mouse;}if (ns4)skn=document.popboxelse if (ns6)skn=document.getElementById("popbox").styleelse if (ie4)skn=document.all.popbox.styleif(ns4)document.captureEvents(Event.MOUSEMOVE);else{skn.visibility="visible"skn.display="none"}function popup(msg,img,fixed){var content="<div id='popimage'><img src='"+img+"' alt='nopic' /></div><div id='poptext'>"+msg+"</div>";yyy=Yoffset;show=fixed; if(ns4){skn.document.write(content);skn.document.close();skn.visibility="visible"} if(ns6){document.getElementById("popbox").innerHTML=content;skn.display=''} if(ie4){document.all("popbox").innerHTML=content;skn.display=''}}function get_mouse(e){var x=(ns4||ns6)?e.pageX:event.x+document.body.scrollLeft;skn.left=x+Xoffset;var y=(ns4||ns6)?e.pageY:event.y+document.body.scrollTop;skn.top=y+yyy;}function kill(){yyy=-1000;if(ns4){skn.visibility="hidden";}else if (ns6||ie4)skn.display="none"show=0}//--></script><a href="http://blehbleh.com" onmouseover="popup('text','image',1)">Shows a box</a>

Link to comment
Share on other sites

onmousemove is triggered whenever the mouse moves while inside the element's boundaries. So if you move the mouse while it's over the element, then it triggers the function again, which recreates your popup at the mouse's new position.onmouseover is triggered whenever the mouse enters the element's boundaries. In order to trigger it again you need to move the mouse off of the element and then back on.That's why it works the way you wanted when you used onmouseover and not when you used onmousemove. :)

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...