Is there a way to specifically apply the css3 transition effect only to the text color?
Imagine having a readmore class with a transition effect defined like this:
.readmore {
colour: red;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
background: url(images/sprite.png) no-repeat 0 0;
}
.readmore:hover {
colour: red;
background: url(images/sprite.png) no-repeat 0 -20px;
}
Now, the goal is to exclude the background image from the transition effect and focus solely on the text color. The current animation when hovering over the text may not be visually appealing due to the image animating along with it.
Any suggestions or advice would be greatly appreciated. Thank you in advance.