使用Tumblr Like按钮和无限滚动

问题描述 投票:4回答:1

我正在尝试在Infinite Scroll中使用新的Tumblr类按钮(允许你的主题在主页上的各个Tumblr帖子上的类似按钮),它们适用于第一个“页面”的前15个帖子,但是一旦它加载另一个页面之类的按钮停止工作。这些是Tumblr在Docs页面上给出的说明:

功能:Tumblr.LikeButton.get_status_by_page(n) 说明:请求新的帖子页面后调用此函数。将刚刚加载的页码作为整数。

功能:Tumblr.LikeButton.get_status_by_post_ids([n,n,n]) 描述:请求喜欢各个帖子的状态。获取一系列帖子ID。

由于我不确定如何正确应用JQuery,我不知道在哪里添加这些函数,这是我当前主题的JS:

    // MASONRY
    var $container = $('#content');

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

    // INFINITE SCROLL
    $container.infinitescroll({
        navSelector  : '#pagination',
        nextSelector : '#pagination li a.pagination_nextlink',
        itemSelector : '.entry',
        loading: {
            img: 'http://static.tumblr.com/glziqhp/K37m9yaub/257__1_.gif'
        }
    },

    function( newElements ) {
        var $newElems = $( newElements ).css({
            opacity: 0
        });
        $newElems.imagesLoaded(function(){
            $newElems.animate({
                opacity: 1
            });
            $container.masonry(
                'appended', $newElems, true
            ); 
        });
    });
scroll tumblr infinite social-media-like
1个回答
10
投票

首先,您需要为每个帖子添加唯一的帖子ID:

<div class="entry masonry-brick" id="{PostID}">...</div>

文档提到在添加/加载新帖子(或新页面)后请求类似状态:

function( newElements ) {
    var $newElems = $( newElements ).css({
        opacity: 0
    });

    // Create Array of $newElems IDs
    var $newElemsIDs = $newElems.map(function () { 
        return this.id; 
    }).get();

    $newElems.imagesLoaded(function(){
        $newElems.animate({
            opacity: 1
        });
        $container.masonry(
            'appended', $newElems, true
        );

        // Let's just see what we have, remove console.log() if working
        console.log($newElems, $newElemsIDs);


        Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
    });
});

我希望能指出你正确的方向。

© www.soinside.com 2019 - 2024. All rights reserved.