How to create image links with hover with Ruby on Rails 4.0?

Question

I have a linked image_tag that I would like to change images on mouseover. II want to make the image is switching on mouseover.

Here's the view code:

<%= link_to image_tag("like.png", size: "30"),
            line_items_path(product_id: product), method: :post, 
            class: "cart_link" %>

I also tried editing the css, but this unfortunately didn't work either:

.cart_link{
    background: url('../assets/like.png');
}

.cart_link:hover{
    background: url('../assets/like_pressed.png');
}

Answer 1

TRy this

<%= link_to "", line_items_path(product_id: product), :class => "cart_link" %>


.cart_link {
     display: inline-block;
     width: 30;
     height: 30;
     background: url('/assets/like.png');
}

.cart_link:hover {
    background: url('/assets/like_pressed.png');
}

EDIT You can see this fiddle where it works http://jsfiddle.net/km6Sp/11/

or you can also use

= image_tag(line_items_path(product_id: product), onMouseover: "this.src='/assets/like.png';", onMouseout: "this.src='/assets/like_pressed.png'" )