Page 1 of 1

Moving the pin.

Posted: Wed Oct 11, 2006 12:15 pm
by JellyFish
I'm trying to move this element I have with ID of "pin".

Code: Select all

<a href="" id="pin" onmousedown="return pin_onmousedown(event)" onclick="return false" style="position:absolute;">
<img src="images/Pin.png" border="0" />
</a>
With these functions in the head:

Code: Select all

function pin_onmousedown(e)
{
	if (document.getElementById("pin").style.left > 100)
	{
		document.getElementById("pin").style.left = 100;
	}
	else if (document.getElementById("pin").style.left < 40)
	{
		document.getElementById("pin").style.left = 40;
	}
	else
	{
		document.getElementById("pin").style.left = e.clientX - 6;
	}
	document.onmousemove = pin_onmousedown;
	document.onmouseup = pin_onmouseup;
	return false;
}
function pin_onmouseup()
{
	document.onmousemove = new Function("return false");
}
It's not doing what I want it to. I want the pin to move horizontally when clicked on, which it does. But then I want it to move only within certain boundaries which I set, which it doesn't.

I don't know what I'm doing wrong the code isn't doing what I commanded it to. It seems to make perfect sense when you look at the code, it's just not stopping at 40 and 100.

Thanks for reading my post. I'd appreciate any help on this matter.

Posted: Wed Oct 11, 2006 12:28 pm
by n00b Saibot

Code: Select all

   if (document.getElementById("pin").offsetLeft > 100) 
   { 
      document.getElementById("pin").style.left = 100; 
   } 
   else if (document.getElementById("pin").offsetLeft < 40) 
   { 
      document.getElementById("pin").style.left = 40;
   } 
   else 
   { 
      document.getElementById("pin").style.left = e.clientX - 6; 
   }

Posted: Wed Oct 11, 2006 12:46 pm
by JellyFish
Wow! This works. I was trying parseInt() because I found the .style.left returns something like: 100px. But this offsetLeft property is the $#!T!!! Thanks man.

Posted: Wed Oct 11, 2006 2:34 pm
by nickvd
how cross browser are the offet* properties?

Posted: Wed Oct 11, 2006 5:44 pm
by JellyFish
Yeah that's a good question???

Posted: Wed Oct 11, 2006 6:32 pm
by n00b Saibot
I believe they apply to all conforming browsers today