【问题标题】:Using Tumblr Like Button with Infinite Scroll使用带有无限滚动的 Tumblr Like 按钮
【发布时间】:2013-04-29 16:53:12
【问题描述】:

我正在尝试在 Infinite Scroll 中使用新的 Tumblr 点赞按钮(允许您的主题在主页上的各个 Tumblr 帖子上使用点赞按钮)它们适用于第一个“页面”的前 15 个帖子,但随后它加载另一个页面,喜欢按钮停止工作。这些是 Tumblr 在文档页面上给出的说明:

功能: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】:

    首先,您需要为每个帖子添加一个唯一的帖子 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);
        });
    });
    

    我希望这会为您指明正确的方向。

    【讨论】:

    • 非常感谢您的帮助,很遗憾这没有奏效。这是我的 Tumblr:andbamnan.tumblr.com 如果您已退出 Tumblr/没有帐户,那么它可以正常工作(我想是因为它们只是变成了通用的“注册 Tumblr”链接)但是一旦您登录心只是没有出现在第一页之后。
    • 你是冠军 mikedidthis,工作就像一个魅力。谢谢哥们!
    • 这很好用,谢谢。这方面的官方文档还存在吗?我在任何地方都找不到它
    猜你喜欢
    • 2014-04-13
    • 2013-08-11
    • 1970-01-01
    • 2017-03-28
    • 2012-09-23
    • 2012-05-08
    • 2013-08-17
    • 1970-01-01
    相关资源
    最近更新 更多