图像/照片库(网格视图)与铁轨？

Question

我想创建一个带有网格视图(facebook风格)的照片库,我想知道这是否仅适用于rails,或者我是否应该使用jquery来实现它.

我正在使用回形针,我试图将图片显示为网格.

如果有人有教程链接或起点,我会很高兴.(我的索引视图已显示所有照片)

index.html.erb

<% title "All Photos" %>

<table>
  <% for photo in @photos %>
    <tr>
    <td><%= link_to image_tag(photo.image.url), photo %></td>
      <td><%= link_to photo.name, photo %></td>
    </tr>
  <% end %>
</table>

谢谢!

Answer 1

这不依赖于Rails,因为您所处理的只是HTML标记的问题.

表格可能是解决这个问题的错误方法 - 至少你已经解决了这个问题.<tr>无法将表格行()设置为以列的形式彼此相邻显示.这里常见的解决方案是使用浮动div来显示您想要的任意数量的列中的内容.以下代码与上面相同,除了使用div:

<div id="gallery">
  <% for photo in @photos %>
    <div class="photo">
      <%= link_to image_tag(photo.image.url), photo %>
      <%= link_to photo.name, photo %>
    </div>
  <% end %>
</div>

然后,只使用CSS,您可以将图像布局为网格.这方面的一个例子是:http: //www.alistapart.com/articles/practicalcss/

从那里,您可以使用JQuery或更多CSS来增强基本实现.