Pop up on rollover text

[robyne]

I have viewed different sources trying to learn the proper coding for pop ups on rollover text but dont understnad the concept. Can you help create pop ups appear whenever rolling over the text with a mouse?

Thanks

[David Harrison]

Perhaps this will help.

[robyne]

your page looks nice however, I must be like a major newbie at this because I couldnt understand what i was reading

[David Harrison]

Well that's actually Eric Meyer's page, but as he says, in each of the links there is a <span> element, that contains some content that you want to pop-up elsewhere on the page. Using CSS you simply hide that content until someone hovers over the link.

You can position it where you like on the page by using absolute positioning and then if you also apply position:relative; to some parent element then any absolute positioning that you apply to the <span> elements will be relative to the top left corner of that parent element, which will probably make it easier to position the "popups" where you want.

It's kind of difficult to explain unless you know some CSS, but the best way to fiigure it out might be to just take that page and mess around with the code behind it to see what happens.

[robyne]

Ok thanks ... what you said is making more sense to me. If I may ask do you have any examples?

[David Harrison]

Afraid I don't know of any more tutorials, Eric was the one who did it first so everyone links to that. I was actually pointed to it at one point when I was learning CSS.

Reading your original post again though, I have to wonder if that's what you really want. How much text exactly were you wanting to appear? If it's 80 characters or less then you could just use a title attribute:

<p title="Here is some text that will appear upon hovering over this paragraph.">
  Blah blah blah.
</p>

What exactly did you have in mind?

[-asx-]

Personally, I like the CSS solution, but OverLib is a good Javascript solution you can implement. The code and tutorial for it are here:

http://www.bosrup.com/web/overlib/