0

我想在点击它时显示图像。我正在使用 Paperclip 来存储图像，并安装了 Fancy-box 来处理图像显示。但我得到这样的错误。

The requested content cannot be loaded.
Please try again later.

我在 SO 中进行了搜索，发现了类似的问题，Fancybox error in rails 试图更改建议的链接，但没有结果。

我的 application.js 文件看起来像这样。

//= require jquery
//= require jquery_ujs
//= require_tree 
//= require fancybox

$(document).ready(function() { $("a.fancybox").fancybox(); });

我想要查看图像弹出窗口的显示视图（如本例中的http://fancybox.net/）看起来像这样。

<a class="fancybox"><%= image_tag @product.photo.url(:thumb) %></a>
4

2 回答 2

2

这是带有源代码的fancybox的适当示例：https ://www.mgtechnologies.co.in/product/fancybox-responsive-jquery-pop-up

试试这个： 

    <a class="fancybox" href="<%= @product.photo.url(:full) %>">
         <%= image_tag @product.photo.url(:thumb) %>
    </a>

下一个

    $("a.fancybox") - is overhead selector
    $(".fancybox") - enought

单击 devTools 中的 fancybox 链接检查网络选项卡后，可能是服务器错误 http://monosnap.com/image/tByHYsWqawv0k5NAVvJrFgpt8

您可以在此处http://fancyapps.com/fancybox/的现代文档中找到一些示例并检查 api

尝试解决这个问题以了解发生了什么：

 $(document).on('click', '.fancybox', (e)->
        $.fancybox.showLoading()
        $.ajax
               url: $(this).attr('href')
               success: (data)->
                 $.fancybox.hideLoading()
                 $.fancybox(data, {
                  afterShow:()->
                     // TODO something
                  overlay :
                    locked : true

                 })

                 true

               dataType: 'html'

        e.preventDefault()
      )
于 2013-07-04T08:12:23.273 回答
1

请尝试一下

应用程序.js

//= require jquery
//= require fancybox
//= require jquery_ujs
//= require_tree .

jQuery(function() {
  $("a.fancybox").fancybox();
});

应用程序.css

*= require_self
*= require fancybox
*= require_tree .

您的查看页面

<%= link_to(image_tag(@product.photo.url(:thumb)), @product.photo.url(:full), :class => 'fancybox')%>
于 2013-07-04T09:52:37.637 回答