Jump to content

I messed up somewhere


jai9x9
 Share

Recommended Posts

I'm working on a World of Warcraft based website for reference to crafted materials, and I'm trying to code a mouseover efect. I seem to have that working to a degree, but now if I scroll down at all on the page, the mouseover effect is left at the top of the page. It's not working at the mousetip. Here's a link to what I've done so far. Can anyone tell me what I did wrong? I'm still new to coding.http://www.geocities.com/asyialw/leather.html

Link to comment
Share on other sites

Ok i think i see the problem.The co-ordinates of the pop up are in relation to the window, not the page length, so that is why when you scroll the pop up starts appearing higher and higher.What is needed is a script that can return where the mouse is on the page not the screen.*goes in search...

Link to comment
Share on other sites

ty for the help, but I'm just not understanding it. I did notice that the code you linked mentioned "if browser is IE" and "if browser is NS." I use Firefox, is that gonna make a difference? And then I'm not sure what to change to make it apply to what I'm trying to do. It would make more sense to me to put that in the code in the heading like what I have. Am I getting any closer?

<heading><script type="text/javascript"><!--function showLayer(e, obj){var x = (e.clientX) ? e.clientX : window.event.clientX;var y = (e.clientY) ? e.clientY : window.event.clientY;var elm = document.getElementById(obj);elm.style.left = x + 10 + 'px';elm.style.top = y + 'px';elm.style.display = 'block';}function hideLayer(obj){var elm = document.getElementById(obj);elm.style.display = 'none';}//--></script>

thats what I'm using now.

Link to comment
Share on other sites

Hey sorry, i haven't neglected you :) Try this.Copy over your bit in the <head>

<html><head><script type="text/javascript"><!--function showLayer(e, obj){var x = (e.clientX) ? e.clientX : window.event.clientX;var y = (e.clientY) ? e.clientY : window.event.clientY;var elm = document.getElementById(obj);elm.style.left = tempX + 10 + 'px';elm.style.top = tempY + 'px';elm.style.display = 'block';}function hideLayer(obj){var elm = document.getElementById(obj);elm.style.display = 'none';}//--></script></head>

Add this to the <body>

<script language="JavaScript1.2"><!-- Beginvar IE = document.all?true:false;if (!IE) document.captureEvents(Event.MOUSEMOVE)document.onmousemove = getMouseXY;var tempX = 0;var tempY = 0;function getMouseXY(e) {if (IE) { // grab the x-y pos.s if browser is IEtempX = event.clientX + document.body.scrollLeft;tempY = event.clientY + document.body.scrollTop;}else {  // grab the x-y pos.s if browser is NStempX = e.pageX;tempY = e.pageY;}  if (tempX < 0){tempX = 0;}if (tempY < 0){tempY = 0;}  return true;}//  End --></script>

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...