开发者

Using jQuery Masonry IsAnimatedFromBottom

Currently when I append new items to my masonry container they are added in the top left corner and then fly into position. However, in this example on the masonry website the new elements appear at the bottom.

It says in the demo description that the demo 'makes use of the IsAnimatedFromBottom flag', but looking at the code I can't see it:

<script> 
  $(function(){

    var $container = $('#container');

    $container.imagesLoaded(function(){
      $container.masonry({
        itemSelector: '.box',
        columnWidth: 100
      });
    });

    $container.infinitescroll({
      navSelector  : '#page-nav',    // selector for the paged navigation 
      nextSelector : '#page-nav a',  // selector for the NEXT link (to page 2)
      itemSelector : '.box',     // selector for all items you'll retrieve
      loading: {
          finishedMsg: 'No more pages to load.',
          img: 'http://i.开发者_StackOverflow社区imgur.com/6RMhx.gif'
        }
      },
      // trigger Masonry as a callback
      function( newElements ) {
        var $newElems = $( newElements );
        // ensure that images load before adding to masonry layout
        $newElems.imagesLoaded(function(){
          $container.masonry( 'appended', $newElems, true ); 
        });
      }
    );

  });
</script> 

Also looking at the listed options it doesn't appear to be listed, so does anyone know how this is used?


Was having some trouble with this myself. I think you actually want to set the flag to true so instead of

.masonry( 'appended', $content, isAnimatedFromBottom )

you would want

.masonry( 'appended', $content, true)


Sorry, always the way, found the answer as soon as I posted! The flag isn't a config setting, but a parameter for the appended method

.masonry( 'appended', $content, isAnimatedFromBottom)
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜