CODEWITHSUNDEEP
jqueryruby-on-railsruby-on-rails-3jquery-masonry
Huy
Huy

Reputation: 11206

Getting Masonry jQuery to Load in Rails App

First time playing with JS/jQuery. I am having trouble getting Masonry to work on my rails project. The script does not appear to be loading. I understand that we don't have to load up jQuery since it comes with Rails default.

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 [email protected]? %>
  <div id="allreview_container_reviewindex">
  <% @reviews.each do |review| %>
    <div class="eachreview_container_reviewindex">
       //Image + text
    </div>            
  <% end %>
  </div>
<% end %>

Gemfile

gem 'jquery-rails'

assets/javascripts/jquery.masonry.min.js

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

Any idea where I'm goofing up?

Edit: I checked to make sure that the jquery.masonry.min.js is being loaded through asset pipeline - it's loading but script isn't working to give me that Pinterest layout.

Upvotes: 1

Views: 1256

Answers (1)

Huy
Huy

Reputation: 11206

Got it to work. Had to enclosed the script like so:

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

Upvotes: 2

Related Questions