Comments on: CSS On-Hover Image Captions

By: Rudy C

Rudy C — Wed, 10 Mar 2010 00:25:21 +0000

Thanks for sharing this css tip and mark up. The only problem that I really see is the hover effect pops up too quickly. I know adding a bit of Javascript can fix this, but that’s more code.

I been reading about CSS3 and its got some good animation and transition capabilities. Perhaps a future post on doing this in CSS3?

I’ve implemented your tips into one of my side projects here:
http://officeforward.com

Thanks again!

Rudy

By: David

David — Mon, 22 Feb 2010 20:28:51 +0000

No worries, I have it sorted, I am using the new WordPress thumbnails functions to return the post thumbnail, and I had the css height set to auto, as I wanted it to collapse if there was no image,FireFox dealt with this ok but IE8 did not, and this was causing a problem, set it to fixed height and width and all is ok.

Regards

David

By: David

David — Mon, 22 Feb 2010 06:22:53 +0000

Hi,
I have added the code to a theme I am working on and it works great in Firefox but not in IE8, any suggestions or ideas?

here is the theme:
http://digitalraindrops.net/demo/wordpress/portfolio

Regards

David

By: Manuel

Manuel — Thu, 18 Feb 2010 20:49:03 +0000

I am trying to do this but i want to make the discription of the image to come up in a different frame. Is this pissible? Well, I am sure it is, just need to know how to do it. I was thinking it would have to be some kind of image rollover with 2 locations, with the second being the discription in a second frame perhaps above a row of 6 different images that would each have its own discription that would change with that images hover. make sense?
thanks.

Manuel
ugd.sales@gmail.com

By: ecommerce

ecommerce — Fri, 15 Jan 2010 00:14:54 +0000

Hi, this is great tutorial and I’ll use it in client ecommerce website hope that will work on dynamic site too, by de way thanks for code.

tina

By: Dandroid

Dandroid — Mon, 07 Dec 2009 16:34:58 +0000

Great tutorial, this is exactly what I needed (the I.E. fixes are what I was really wrestling with). Thanks

By: George

George — Fri, 13 Nov 2009 17:28:22 +0000

I’m using the “Spotless” wordpress theme for my photo-blog. It looks great, but I would like to be able to add anecdotal information to each main image (not Exif) without taking away from the clean design. I figured that a hover caption was the answer and came across On-hover which is exactly what I need.

Setting up the blog… http://www.coppercoastworkshops.com/minimalistics/ …took me an age. But the problem is that I really don’t have a clue where the above code is placed – although I would imagine it’s on the style sheet.

If there’s anyone out there who could point this newby in the right direction I would be so grateful. Thank you. George

By: VK

VK — Wed, 21 Oct 2009 14:22:35 +0000

How do you get this to work with text instead of pics. I need to get this working with a name then I can put in a pic of the name and info about it.

By: Kel

Kel — Thu, 15 Oct 2009 03:23:44 +0000

Thanks for the tutorial. I noticed that the image caption can be read and indexed by Google.

Is there a way to have the caption not seen by Google but just seen by users to the site? I want to keep duplicate content on the sidebar at a minimum and if I could accomplish the above, it would help greatly.

Thank you

By: Oscar

Oscar — Fri, 09 Oct 2009 19:41:08 +0000

Hey, great stuff.. but!

I would like to be able to put links in the caption text, but its not possible. The (a href=”#”) collides with any new (a href) you put in the caption.

what does the (a href=”#”) do really?
Is there a work around?

I would really appriciate any help!

(delete previous post)