Recognising an image variable in Ruby on Rails HTML to run jquery Image Zoom

Question

I am trying to use the Simple jQuery Image Magnifier & Enlargement Plugin - imagezoom with ruby on rails and cannot find a way to reference an image variable within the show.html.erb file.

The code in my html I am trying to make work is:

<script src="imagezoom.js"></script>
<style>
.thumb-image { width: 500px; }
.thumb-image > img { width: 100%; }
</style>
</head>

  <div class="row">
    <h2>Basic</h2>
    <div class="thumb-image"> <img src="<%= image_tag @product.img_url %>" data-imagezoom="true"> </div>

The image_tag @product.img_url references an image in the assets folder, however the standard jquery code is looking for an image in the conventional way eg

<img src="**/assets/image1.jpg**" data-imagezoom="true">

Is there a way I can reference the image variable in the HTML so the zoom function will work?

Answer 1

Instead of:

<img src="<%= image_tag @product.img_url %>" data-imagezoom="true">

Just do:

<%= image_tag @product.img_url, :data => { :imagezoom => "true" } %>

Checkout the documentation of image_tag method for more information.