« How Do I Convert Seconds to Minutes in Excel?
Dual Monitors: How to Have a Different Wallpaper on Each Desktop »

Highlight, Display, Create On-Hover or On-Mouseover Text-Captions Over an Image Using CSS


Hah! Do you like the title? It’s a bit long and grandiloquent, but this was an attempt to save you some time.  I am hoping I captured enough keywords from all of the searches I did that

CSS On-Hover Image Captions

The Long Road Home

you managed to find this page.   Soh Tanaka is a talented web designer and developer and thankfully he took the time out to write CSS On-Hover Image Captions.

I used his code to successfully implement captions over images using only CSS for EduBasics: Home of Multiplication Hip Hop product page. In all it took about 15 minutes to update the stylesheet, html and upload it to the server. At the end of the day I hope this saved you some time and provided the code you needed.

A little due diligence; here are the Google queries that led me to Soh’s article - CSS On-Hover Image Captions. This list is a history of two hours of fumbling around on the internet. The queries are in order #1 being the last query that led me to the light.  What search did you perform to get here? Comment and let me know.

  1. css image captions (after two hours)
  2. show text over image css on hover
  3. display text over image on hover using css
  4. diplay text over image on hover using css
  5. on hover show text
  6. css hover display text
  7. css hover display image
  8. show text over image on hover
  9. display text over image
  10. css hover
  11. show text on hover using css
  12. show text on hover
  13. highlight image hover effect
  14. how to highlight and show text using javascript
  15. call multiple javascript functions
  16. script.aculo.us highlight on mouseover
  17. mootools
  18. jquery
  19. highlight on mouseover and display text jquery
  20. highlight on mouseover and display text
  21. spry highlight
  22. scriptaculous
  23. moo tools

,

This entry was posted on Saturday, August 22nd, 2009, 9:56 pm and is filed under Web Design. You can follow any responses to this entry through RSS 2.0. You can leave a response, or trackback from your own site.

  1. #1 by cindy - August 23rd, 2009 at 07:19

    my search was no way as long as yours because I gave up! I was so gee-darn frustrated….until I found this article thank you SO VERY MUCH!

    Reply Quote

    • #2 by thinkpointclick - August 23rd, 2009 at 16:21

      No problem. I'm glad I could help. I know how frustrating it can be when you "think" you know what you want, but for what ever reason you just can't find it.

      Reply Quote

  2. #3 by Aaron Lecciones - September 25th, 2009 at 08:21

    thanks so much and because you did capture enough keywords only one search (i think) lead me to this!

    Gratz!
    I’m currently fixing a new website for http://www.jkfddc.com.ph and I totally need on hover show captions in CSS.

    Thanks!

    Reply Quote

  3. #4 by Jason - December 29th, 2009 at 21:29

    Same….thank! :)

    Reply Quote
(will not be published)
  1. No trackbacks yet.