Links

Lists

Latest Updates

Ruby On Rails List
Python list
Advanced Java
The JavaScript List
Apache Users
Full Disclosure
Linux Security

Search the archives!
Having a development problem? Ask eDevelopment.org forums!

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

[Javascript] An easy one for the experts :-)

  • From: javascript@xxxxxxxxxx (Matthieu Féron)
  • Subject: [Javascript] An easy one for the experts :-)
  • Date: Thu, 20 Dec 2001 14:54:08 +0100
I don't have the time to test more but this source should work as is

<html><head><title>Test</title>
<script>
function position(NSevent)
{
	if ( document.all ) // IE
	{
        document.all["mydiv"].pixelTop=3D
		document.all["myboard"].pixelTop+window.event.( one of
the coords property : x,offsetX );
	}
	else // NS
	{
		document.layers["mydiv"].top =3D
document.layers["myboard"].top + NSevent.( one of the coords property :
x,offsetX )
	}
}
</script>
</head>
<body>
<div id=3Dmyboard name=3Dmyboard style"position:absolute; top:150; =
left:150;
visibility:visible"><a href=3D"#" onclick=3Dposition;><img id=3D"board"
width=3D"320" height=3D"320" src=3D"board.gif"></a></div>
<div id=3Dmydiv name=3Dmydiv style"position:absolute; top:15; left:15;
visibility:visible">
<img id=3D"cursor" src=3D"cursor.gif">
</div>
</body>
</html>

-----Message d'origine-----
De : brian@xxxxxxxx [mailto:brian@xxxxxxxx]
Envoy=E9 : jeudi 20 d=E9cembre 2001 16:39
=C0 : javascript@xxxxxxxxxx
Objet : RE: [Javascript] An easy one for the experts :-)



Hello,

Ok - could you give me a simple example, please?  Just the
bare essentials.   I did try at one time to wrap the images
into a div container - but I didn't have much luck :(


Kind regards,
Brian

On Thu, 20 Dec 2001 14:35:04 +0100, javascript@xxxxxxxxxx said:
>for cross browser solution, don't use IE dom programming.
>So use a href around your image and a div to locate your image
>on the window.
>
>-----Message d'origine-----
>De : brian@xxxxxxxx [mailto:brian@xxxxxxxx]
>Envoy=E9 : jeudi 20 d=E9cembre 2001 16:27
>=C0 : javascript@xxxxxxxxxx
>Objet : [Javascript] An easy one for the experts :-)
>
>
>
>Hi,
>
>I have searched the manuals .. on google .. in archives ... without
>luck.
>
>Consider this piece of code:
>
><html><head><title>Test</title>
><script>
>function position(event)
>{
>        cursor.style.posLeft=3Dboard.style.posLeft+event.x;
>        cursor.style.posTop=3Dboard.style.posTop+event.y;
>}
></script>
></head>
><body>
><p><img id=3D"board" width=3D"320" height=3D"320" src=3D"board.gif"
>style=3D"position:relative;" onClick=3D"position(event)">
><img id=3D"cursor" src=3D"cursor.gif" style=3D"position:absolute">
></body>
></html>
>
>Purpose:
>
>- whenever a mouse click is detected on board move the cursor to this
>position.
>
>Problem:
>
>- although the code works (!) the cursor is misaligned.  That is, it is
>positioned something like 5 pixels to the left of the click and 5
pixels
>above the click.    I've tried to use pageXOffset and pageYOffset to
>adjust the cursor - but I guess they're only good when scrollbars are
>involved.
>
>
>How do I solve this?   I know I can set position:absolute et al on the
>board, but this is not acceptable ...
>
>I'm mainly targeting IE but, if at all possible, would like to see a
>cross-browser solution :-)
>
>
>Merry Christmas,
>
>Brian
>_______________________________________________
>Javascript mailing list
>Javascript@xxxxxxxxxx
>https://lists.LaTech.edu/mailman/listinfo/javascript
>_______________________________________________
>Javascript mailing list
>Javascript@xxxxxxxxxx
>https://lists.LaTech.edu/mailman/listinfo/javascript
>
_______________________________________________
Javascript mailing list
Javascript@xxxxxxxxxx
https://lists.LaTech.edu/mailman/listinfo/javascript