img:hover {
blah blah blah ...
}
or use whatever class you have for those particular images.
Or use javascript. Ive used this before:
http://www.codingforums.com/archive/index.php?t-41093.html
Thread Starter
torley
(@torley)
Aha, that sounds simpler than I thought it’d be. I’ll give it a spin, thank you whooami!
your welcome, good luck 🙂
the js trick is nice, Ive no clue how ff well handles it though, since I used it back before I actually made the switch. It does a really neat opacity thing.
Thread Starter
torley
(@torley)
Hmmm — I just did things the normal way with CSS, no Javascript, but now I notice it makes *every* image of mine highlight when I hover the cursor over. Is there a way to make only actual linked images do this?
:hover doesn’t work in IE on anything but anchor links. At least, IE 6 and below, anyway – it supposedly works in IE7, but I haven’t tried it yet 🙂
You *could* use a javascript (I’ve used “whatever hover” script before: http://www.xs4all.nl/~peterned/csshover.html)
But the simplest method? Wrap an achor tag around the image with a hashmark (or blank space) for the href. Then apply the border to the image with CSS and have it change on hover. No scripts needed and it works in older IE versions.
Just my 2 cents (which is about what it’s worth!) 😉
Is there a way to make only actual linked images do this?
add a class to the specific ones you want to change.
Thread Starter
torley
(@torley)
Thank you also, doodlebee! Problem with having a specific class is the majority of my images are linked, and a minority aren’t.
It looks like :hover does work in IE 7.
Re:
“Wrap an achor tag around the image with a hashmark (or blank space) for the href. Then apply the border to the image with CSS and have it change on hover. No scripts needed and it works in older IE versions.”
I’m not exactly clear on how to do that, can you please give me an example?
I’m not exactly clear on how to do that, can you please give me an example?
<a href="#" class="different"><img src="image.gif" alt="image" /></a>
Pretty simple – just the same way you’d put an anchor link around anything. The hashmark mkes it so if anyone clicks on the image, they staty in the same spot – it doesn’t take them anywhere.
Problem with having a specific class is the majority of my images are linked, and a minority aren’t.
You can put the hover properties on the image in the stylesheet (thus ‘class=”different”‘). Anytime you want an image to appear with the hover differece, just add that class to it. If the image is already links, you can add the class to the one you want different – not a big deal. it won’t change any other styling you have on it, and if you *do* want the image to take you somewher,e you just replace the hashmark with the URL. CHances are, if the image in question that you want to change already has the link stuff – just add the class to it – nothing more needs ot be done (except to make your visual changes in the stylesheet).
Thread Starter
torley
(@torley)
Aha, gotcha! This makes a lot more sense to me. Your time helping me figure this out is really appreciated. I’m more used to working graphically than “in the code” but all this helps me to have a better understanding of what it is I need to do.
I learned a new term, too! I’ve not known “#” as “hashmark” before, only as “the pound key”. Hehe.
