20seven

Devigner blog about development and design

Using File_column With LightBox

Using lightbox.js with file_column is a piece-o-cake.

Within the head, add in the defaults so we can use protoype, which is required by lightbox.js and add in the css and js for lightbox.

<%= javascript_include_tag :defaults %>
<%= javascript_include_tag "lightbox" %>
<%= stylesheet_link_tag "lightbox", :media => "all" %>

In the view:

<% @images.each do |image| %>
   <a href="<%= image_path(url_for_file_column(image, "image")) %>" rel="lightbox" title="<%= h(image.caption) %>">
   <%= image_tag url_for_file_column(image, "image", "thumb") %> </a>
<% end %>

Watch any onload conflicts between lightbox and any other javascripts. That had me scratching my head for a few minutes. If there’s a conflict, simply add to your body tag onload="initLightbox()" and that will do it.

Now grab a glass of milk and finish your cake. Non-fat if you sit in front of a monitor all day.