在Rails App中加载Masonry jQuery

时间:2012-09-09 19:19:04

标签: jquery ruby-on-rails ruby-on-rails-3 jquery-masonry

第一次玩JS / jQuery。我无法让Masonry在我的rails项目上工作。该脚本似乎没有加载。我知道我们不必加载jQuery,因为它带有Rails默认值。

index.html.erb

<script src="/path/to/jquery.masonry.min.js"></script>

<script>
var $container = $('#allreview_container_reviewindex');
$container.imagesLoaded(function(){
  $container.masonry({
    itemSelector : '.eachreview_container_reviewindex',
   // columnWidth : 240
  });
});
</script>

<% if !@reviews.blank? %>
  <div id="allreview_container_reviewindex">
  <% @reviews.each do |review| %>
    <div class="eachreview_container_reviewindex">
       //Image + text
    </div>            
  <% end %>
  </div>
<% end %>

的Gemfile

gem 'jquery-rails'

资产/ Javascript角/ jquery.masonry.min.js

//I copied the source from http://masonry.desandro.com/

知道我在哪儿搞砸了吗?

编辑:我检查确保通过资产管道加载jquery.masonry.min.js - 它正在加载,但脚本无法为我提供Pinterest布局。

1 个答案:

答案 0 :(得分:2)

让它发挥作用。不得不像这样附上脚本:

$(function () {
  var $container = $('#allreview_container_reviewindex');
    $container.imagesLoaded(function(){
      $container.masonry({
       itemSelector : '.eachreview_container_reviewindex',
       //columnWidth : 240
    });
  });
});