首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >JQuery固定边栏不工作长内容

JQuery固定边栏不工作长内容
EN

Stack Overflow用户
提问于 2012-04-20 05:00:56
回答 1查看 579关注 0票数 0

我有一个wordpress网站,在文章页面中,我有一个jquery固定侧边栏。固定的侧边栏从post部分开始,在注释部分停止。

我正在使用这个jquery

代码语言:javascript
复制
$window = $(window),
    $sidebar = $("#side-scroller"),
    sidebarTop = $sidebar.position().top,
    sidebarHeight = $sidebar.height(),
    $footer = $("#comments"),
    footerTop = $footer.position().top,    
    $sidebar.addClass('fixed');

    function isScrolledIntoView(elem)
    {
        var docViewTop = $(window).scrollTop();
        var docViewBottom = docViewTop + $(window).height();

        var elemTop = $(elem).offset().top;
        var elemBottom = elemTop + $(elem).height();

        return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
    }


    $window.scroll(function(event) {
        scrollTop = $window.scrollTop(),
        topPosition = Math.max(0, sidebarTop - scrollTop),
        topPosition = Math.min(topPosition, (footerTop - scrollTop) - sidebarHeight);
        $sidebar.css('top', topPosition);

        if(isScrolledIntoView('#comments')){
            $("#side-scroller").hide();
        }
        else{
            $("#side-scroller").show();
        }
    });

这很好,但是当文章内容太长时,它就永远不会停止在注释部分。

在这里你可以看到演示,

普通职位(固定侧边栏工作正常) http://webstutorial.com/html5-css3-toggle-slideup-slidedown/html-5

和长文章(侧边栏继续滚动) http://webstutorial.com/google-server-side-geocoding-php-infobox/website-tweaks/google

这不是垃圾邮件,或者链接建设,所以请不要投

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-04-23 16:38:01

我认为它是工作的,但它是不正确的计算高度,因为页面的变化后加载。

因此,如果您将它移到$window.scroll函数中,它应该在滚动中得到正确的值。

代码语言:javascript
复制
$footer = $("#comments"),
footerTop = $footer.position().top;
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/10240526

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档