How to make a DIv with a Rails Link clickable?

Question

I have a large div:

.limeskin:hover {
  background: #eee;
  cursor: pointer;
  display: block;
}

that I want to be clickable. Because I\'m

Answer 1

Using Link_to as below would be sufficient even when you have a big block including multiple tags:

<%= link_to desired_path do %>
    <div class="linkable">
        <another div>
             ... some other tags
        </another div>
    </div>
<% end %>

and I recommend you to use a different background color for mouse over events because it shows the viewer that it's a link!

In you .css file:

.linkable:hover{
    background-color: red;

}

Answer 2

Use javascript (I recommend jQuery) to make the action actually happen and CSS hover selector to modify the div background and the cursor (to change the cursor from an arrow to a hand).

Answer 3

link_to can accept a block:

<%= link_to root_path do %>
  <div>Hey!</div>
<% end %>

This will surround the div with <a> tags.

Documentation: http://apidock.com/rails/ActionView/Helpers/UrlHelper/link_to

Or if you have a big div and want to make it "clickable", using jQuery:

# html.erb
<div class="limeskin">
  <div class="limebox">
    <div class="limecost">
      <b>Price:</b>
      <%= number_to_currency(post.price, :unit => "R") %><br>
      #[...]
    </div>
  </div>
</div>

# jQuery.js
$('.limeskin').click( function(event) {
  var clicked_div = $(this);
  # do stuff with the event object and 'this' which 
  # represent the element you just clicked on
});

jsFiddle: http://jsfiddle.net/Lxw34w5o/1/