小编and*_*nan的帖子

粘滞侧边栏:向下滚动时粘到底部,向上滚动时粘到顶部

我一直在寻找一些解决我的粘性侧边栏问题的方法.我有一个特定的想法,我希望它如何行动; 实际上,当你向下滚动时我希望它坚持到底部,然后一旦你向上滚动我想它以流畅的动作(没有跳跃)粘在顶部.我无法找到我想要实现的示例,因此我创建了一个图像,希望能够更清楚地说明这一点:

粘滞侧边栏:向下滚动时粘到底部,向上滚动时粘到顶部

  1. 边栏位于标题下方.
  2. 向下滚动时,侧边栏与页面内容保持同一水平,以便您可以滚动浏览侧边栏和内容.
  3. 到达侧边栏的底部,侧边栏粘在视口的底部(大多数插件只允许粘到顶部,一些允许粘到底部不允许两者).
  4. 到达底部,侧边栏位于页脚上方.
  5. 当您向上滚动时,侧边栏与内容保持一致,因此您可以再次滚动内容和侧边栏.
  6. 到达侧边栏的顶部,侧边栏会粘到视口的顶部.
  7. 到达顶部,侧边栏位于标题下方.

我希望这是足够的信息.我已经创建了一个jsfiddle来测试任何插件/脚本,我已经重置了这个问题:http://jsfiddle.net/jslucas/yr9gV/2/ .

jquery position sidebar fixed sticky

73
推荐指数
4
解决办法
4万
查看次数

使用Tumblr Like按钮和无限滚动

我正在尝试在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
            ); 
        });
    });
Run Code Online (Sandbox Code Playgroud)

scroll infinite tumblr social-media-like

4
推荐指数
1
解决办法
3536
查看次数

禁用移动设备的jQuery

我想为移动设备禁用部分jQuery脚本,以下是我要禁用的代码:

$('#inner-slide1').click(function(e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);
});

$('#inner-slide2').click(function(e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);
});

$('#inner-slide3').click(function(e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);
});

$('#inner-slide4').click(function(e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);
});

$('#inner-slide5').click(function(e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);
});
Run Code Online (Sandbox Code Playgroud)

感谢任何建议.

mobile jquery

-1
推荐指数
1
解决办法
7134
查看次数