mouseover text box - javascript?

User 2096904 Photo


Registered User
87 posts

Can anyone recommend a javascript where when the mouse is held over an image or link, a text box pops up with additional information? If you can submit a link so I can see it in action that would be great.

I'm reading CSS can do it also?
User 271657 Photo


Ambassador
3,816 posts

I've got this bookmarked – but I've never used it. I liked that it's just CSS, no additional JS required.
http://meyerweb.com/eric/css/edge/popups/demo.html

Scroll over the menu at left to see it work.
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 2733 Photo


Ambassador
426 posts

Tooltips at CodeCanyon
Let's not get all hurt.
User 187934 Photo


Senior Advisor
20,265 posts
Online Now

As requested.;)
http://progrower.coffeecup.com/picsmouseover.html
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2273654 Photo


Registered User
772 posts

You are perfectly describing alternate text image labels

http://www.workhorsepainting.com/

on the link home pg the blue banner for the blog is a image and link and hover over the image you get the alternate text which describes the link I think it says "link to WHPC Blog"
My CC S-drive site https://workhorsepainting.com
User 2073552 Photo


Registered User
1,625 posts

GregB. wrote:
You are perfectly describing alternate text image labels

http://www.workhorsepainting.com/

on the link home pg the blue banner for the blog is a image and link and hover over the image you get the alternate text which describes the link I think it says "link to WHPC Blog"


That is what I was going to suggest. lol Because adding Javascript to do it for you is a bit much. :P
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.
User 2733 Photo


Ambassador
426 posts

I think Amy is looking for tooltips not the alt attribute. Alt attributes are for screen readers and alternate text for missing images. Besides alt attributes don't pop up text boxes. Her inquiry regarding a JavaScript solution points to tooltips.

Fortunately for Amy, Eric's suggestion is super easy to use. My CodeCanyon link provides many other variations on the same principle at minimal cost for super functional, creative designs.
Let's not get all hurt.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.