从Backstretch图像创建链接？

Question

我使用Backstretch作为在Ruby on Rails项目中获得良好一致的用户体验跨浏览器的一种方式。图片实际上是SalesPage模型的实例，并且在图片网址旁边有一个标题和一个链接到它们的网址。

我加载图片如下：

- images = [] 
- sales_pages_images = [] 
- @sales_pages.each do |page| 
- images << "'#{page.images.first.image.url}'" 

#backgroundImageSlider 
    :javascript 
    var images = [#{images.join(",")}]; 
    $(images).each(function(){ $("<img/>")[0].src = this; }); 
    var index = 0; 
    setInterval(function() { index = (index >= images.length - 1) ? 0 : index + 1;  $.backstretch(images[index]);}, 5000); 
$.backstretch(images[index], {speed: 500}); 

这工作得很好。除了我想将图像制作成链接这一事实。我希望可以点击背景图片，并将它们链接到数据库中的网址。我不是JavaScript的英雄，所以我不能让它的工作:(提前

感谢您的帮助！

Answer 1

试试这个！:)

假设你的标记，你有一个<a>标签立即围绕您的<img/>标签，然后在您的视图中...

- images = @sales_pages.inject([]) do |images, sales_page| 
    - images << "sales_page.images.first.image.url" 

    :javascript 
    $imageTag = $("img"); 
    $imageLink = $imageTag.parent() 
    $imageTag.backstretch(#{images}, { duration: 5000, fade: 500, }); 
    $(window).on("backstretch.after", function (e, instance, index) { 
     $imageLink.attr('href') = #{@sales_pages[index].link}; 
    });