- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
I am still having issues with hover effects on the site I am editing:
-site url removed by author-
As you can see, the first image changes opacity when hovered over, I cannot figure out how to apply this same effect to the rest of the images though…not sure why. I am using the same HTML div tags and it’s not working. Any suggestions?
Here is the CSS I am using:
#hoverfx img {opacity:1;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 500ms;}
#hoverfx img:hover{opacity: .5;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 500ms;}
HTML is:
< div id = "hoverfx" >
image
< / div >
Thank you!
Thanks for the quick response…I thought that was the issue at first as well, but even when I don’t close the div until the very end, the hover effect is still only applying itself to the first image.
You have errors all over the place, including stuff like this: lazyload-src=” width=” which could be causing errors with all sorts of renderings.