Zurb基金会用Rails揭示模态

时间:2013-12-23 10:52:35

标签: ruby-on-rails ruby-on-rails-3 zurb-foundation refinerycms

我在RefineryCMS网站上使用Zurb Foundation CSS框架,我有一个包含许多缩略图的图库页面,我希望图像是一个链接,打开显示模式,里面有更大的图像和描述它,基本上是我的展示页面。

我之前使用过fancy_box插件非常简单,但无法想出这个插件。

索引页

 <ul class="large-block-grid-4" id="galleries">
  <% @galleries.each do |g| %>
   <li>
    <%= link_to refinery.galleries_gallery_path(g), :remote => "true", :data => { :"reveal-id" => "modal", :"reveal-ajax" => "true" } do %>
      <%= image_fu g.image, "250x250" %>
    <% end %>
   </li>
  <% end %>
 </ul>

show.js.erb

$("#modal").html('<%= escape_javascript(render "modal", image: @image)%>') 
$('#modal').foundation('reveal', 'open');

_modal.html.erb

<div id="modal" class="reveal-modal" data-reveal>
  <h2><%=raw @gallery.title %></h2>
  <%= image_fu @gallery.image, "600x600" %>
  <%=raw @gallery.description %>
  <a class="close-reveal-modal">&#215;</a>
</div>

控制器

def show
    @gallery = Gallery.find(params[:id])
    respond_to do |format|
      format.js
    end
end

1 个答案:

答案 0 :(得分:1)

您可以在链接标记内使用图片标记

  <%= link_to image_tag(g.image, "250x250"),"#" %>