Javascript 根据引导样例模板中的滚动效果

当用户按照页面中的“#subnav”div在高度上滚动到元素之外时，我尝试将元素固定到顶部

环顾谷歌，我成功地形成了以下函数和代码

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

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

    if(docViewTop >= elemBottom){
    return true;
    }else{
    return false;
    }
}

$(window).scroll(function(){
    if(!$("#search_menu").hasClass("subnav-fixed")){
        if(!isScrolledIntoView($("#search_menu"))){
            $("#search_menu").addClass("subnav-fixed");
        }       
    }else{

        var docViewTop = $(window).scrollTop();
        var docViewBottom = docViewTop + $(window).height();

        $("#window_top").html(docViewTop);
        $("#window_bottom").html(docViewBottom);
        $("#height").html(element_frm_top);

        if(docViewTop < element_frm_top < docViewBottom){
            $("#search_menu").removeClass("subnav-fixed");
        }
    }
});

函数是crolledintoview（elem）
{
var docViewTop=$（window.scrollTop（）；
var docViewBottom=docViewTop+$（window）.height（）；
var elemTop=$（elem）.offset（）.top；
var elemBottom=elemTop+$（elem）.height（）；
如果（docViewTop>=elemBottom）{
返回true；
}否则{
返回false；
}
}
$（窗口）。滚动（函数（）{
if（！$（“#搜索菜单”）.hasClass（“subnav固定”））{
如果（！isScrolledIntoView（$（“#搜索菜单”））{
$（“#搜索菜单”）.addClass（“subnav固定”）；
}       
}否则{
var docViewTop=$（window.scrollTop（）；
var docViewBottom=docViewTop+$（window）.height（）；
$（“#window_top”）.html（docViewTop）；
$（“#window_bottom”）.html（docViewBottom）；
$（“#高度”）.html（元素_frm_top）；
if（docViewTop

用这个。我能够添加subnav固定类，并将div位置固定到顶部。但我无法让它在向上滚动后返回其原始位置。想知道哪里出了问题，或者其他人是否有更好的解决方案。

我认为应该是这样

$(window).scroll(function(){
    if(!$("#search_menu").hasClass("subnav-fixed")){
        if(!isScrolledIntoView($("#search_menu"))){
            $("#search_menu").addClass("subnav-fixed");
        }       
    }else{
        if(isScrolledIntoView($("#search_menu"))){
            $("#search_menu").removeClass("subnav-fixed");
        }
    }
});

没有测试

也考虑更改<代码>（DOCVIEWTop>>LealButt）< /C> >代码> >（DOCTVIEWTROP> = EndoToTM）< /C>>/P> 编辑

这取决于你把“搜索”菜单放在哪里。假设它是top:40px，那么它应该是：

函数是crolledintoview（elem）{
var docViewTop=$（window.scrollTop（）；
var docViewBottom=docViewTop+$（window）.height（）；
var elemTop=$（elem）.offset（）.top-40；
var elemBottom=elemTop+$（elem）.height（）；
如果（docViewTop>=elemTop）{
返回true；
}否则{
返回false；
}
}
$（窗口）。滚动（函数（）{
变量$body=$（'body'），
$menu=$（“搜索菜单”）；
if（！$menu.hasClass（“subnav固定”））{
如果（isScrolledIntoView（$menu））{
$menu.addClass（“subnav固定”）；
}
}否则{
如果（$（window.scrollTop（）可爱；）按我希望的方式工作，谢谢
function isScrolledIntoView(elem) {
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();

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

    if (docViewTop >= elemTop) {
        return true;
    } else {
        return false;
    }
}

$(window).scroll(function () {
    var $body = $('body'),
        $menu = $("#search_menu");
    if (!$menu.hasClass("subnav-fixed")) {
        if (isScrolledIntoView($menu)) {
            $menu.addClass("subnav-fixed");
        }
    } else {
        if ($(window).scrollTop() <= 40) {
            $menu.removeClass("subnav-fixed");
        }
    }
});