jQuery slideshow with images pulled from rails doesn't work

belgin fish

New Member
I am trying to implement a slideshow in Rails 3.2, but without luck.I tried to follow this tutorial http://www.designchemical.com/lab/jquery/demo/jquery_demo_image_swap_gallery.htm/, but since I am new to Rails and jQuery I am completely lost on how to apply the commands to call the images from the database. Therefore I really appreciate if you guys can help me out.So far all images (one main image on top and below 4 small ones (the main one + 3 other)) are called from the database and displayed correctly on the webpage, but I would like to apply a slide-show to it to make it look nicer. By hovering over the smaller images below they shall be displayed as the main picture on top.That's the code I have:app/views/homes/show.html.erb\[code\]<div class="homepics"> <div class="homemainpic"> <%= image_tag "/"[email protected][0].image_path, :size => "925x600" %> </div> <ul> <% @home.images.each {|image| %> <li><%= image_tag "/"+image.image_path, :size => "220x150" %></li> <% } %> </ul></div> \[/code\]app/assets/javascripts\[code\]$(document).ready(function() { $(".homemainpic li image_tag").hover(function() { $('image_tag').attr('src', $(this).attr('src').replace('image_tag "/"+image.image_path')); }); var imgSwap = []; $(".homemainpic li image_tag").each(function() { imgURL = this.src.replace('image_tag "/"+image.image_path'); imgSwap.push(imgURL); }); $(imgSwap).preload();}); $.fn.preload = function() { this.each(function() { $('image_tag "/"[email protected][0].image_path') [0].src = http://stackoverflow.com/questions/15869907/this; }); };\[/code\]
 
Back
Top