I\'m trying to create a hover image for my \'read more\' button on blogger. I\'m trying to reference:
You can try like this-
.jump-link:hover {
background: url('http://1.bp.blogspot.com/-i936l-GupbU/Vp4Z9y7tpAI/AAAAAAAAAgw/lyJYJds5PNc/s1600/readmorerollover.jpg') no-repeat ;
}
.jump-link:hover img{opacity:0;}
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url' expr:title='data:post.title'><img src='http://3.bp.blogspot.com/-JpvWYCR8FXA/Vp1oL9cD7BI/AAAAAAAAAe4/1PRPh1ASGG8/s1600/extendedreadmore.png'/></a>
</div>
</b:if>
I hope I'll helps you.
You are using background as a standalone property.
What you are looking for is:
.jump-link:hover
{
background-image: url('http://1.bp.blogspot.com/-i936l-GupbU/Vp4Z9y7tpAI/AAAAAAAAAgw/lyJYJds5PNc/s1600/readmorerollover.jpg');
}
More information Here