tags:

views:

54

answers:

3

I have a need to create a small pop up information box when a user clicks on a certain link. Basically just a hidden div that floats above the content at the location almost like a tooltip, but requiring a click.

I've tried passing the event.clientX and clientY to the style.left and style.right properties, but it doesn't seem to put it at the correct location.

Just wondering if there's a very simple way that I'm overlooking.

+3  A: 

I recommend you use jQuery for this; it makes Javascript much simpler to write.

Your problem is that event.clientX (and Y) are relative the the element that the event came from. You need to use event.pageX and event.pageY, or event.x and event.y in IE.

If you handle the event using jQuery, it'll fix things automatically, allowing you to simply use pageX and pageY.

SLaks
+1  A: 

Use a library. The people who need to maintain the site after you will thank you.

jQuery tooltip library

Stefan Kendall
A: 

Sounds like you need a tool tip to me. YUI provides a nice widget out of the box for this

http://developer.yahoo.com/yui/examples/container/tooltip.html

Zoidberg