2

当用户到达我的网站底部时,我使用一个isotope和一个脚本的组合来加载更多数据:infinite-scroll

var $ = jQuery,
$container = $('#content.grided .wrap #gridcontainer');
if ( $container.length > 0 ) {
    $container.isotope({
        itemSelector : '.grid-item',
        masonry : {
            columnWidth : 240
        }
    });     
        //enable infinity scroll
    $container.infinitescroll({
            navSelector  : '#posts_navi',    // selector for the paged navigation 
            nextSelector : '#posts_navi a.previous_posts',  // selector for the NEXT link (to page 2)
            itemSelector : '.grid-item',     // selector for all items you'll retrieve
            loading: {
                finishedMsg: 'No more pages to load.',
                img: 'http://i.imgur.com/qkKy8.gif'
              }
            },
            // call Isotope as a callback
            function( newElements ) {
              $container.isotope( 'appended', $( newElements ) ); 
            }
          );    
    }

将元素添加到 dom 后,我想仅在这些元素上运行 jQuery 脚本,以添加一些行为:

$('#gridcontainer .grid-item').each(function(){
    var $this = $(this),
    $overlay = $this.find('span.overlay');

    $this.hover(
        function(){
            $this.addClass('hovered');
            $overlay.stop().hide().fadeIn('100');
        },
        function(){
            $this.removeClass('hovered');
            $overlay.stop().show().fadeOut('100');
        }
    );
}

我知道我应该在第一个脚本的回调函数中执行它,在哪里isotope append使用,但是我应该如何正确执行呢?

4

0 回答 0