Javascript使侧边栏"滚动"与页面直到其底部边缘击中页脚

时间:2016-09-11 12:27:30

标签: javascript jquery sidebar vertical-scrolling

Javascript制作侧边栏"滚动"与页面直到其底部边缘击中页脚。关键是我有这个侧边栏应该与页面一起滚动,当它的下边缘到达页脚的上边缘时停止 - 在该点之后它应该默认行为(再次是静态的),这可以在这里看到:{{ 3}}。这个问题类似于这个问题http://zakuvavanje.rs/,我不想问这个问题,但是我不知道如何实现这个问题,脚本应该放在我放的地方

console.log('now the script should start');

P.S。问题是对于较小的屏幕,请将视口设置为1366x768或更低以查看问题。这是我的脚本的标签:jQuery scrolling DIV: stop scrolling when DIV reaches footer,这里的脚本相同:

//"fixed" sidebar
function scrollingAside() {

    var $aside     = $('.aside'),
        asideH     = $aside.outerHeight(),
        asideTop   = $aside.offset().top,
        docH       = $(document).height(),
        asideOfsB  = docH - asideTop - asideH,
        footerH    = $('.footer').outerHeight(),
        wScrollTop = $(window).scrollTop(),
        wHeight    = $(window).height(),
        scrollBtm  = docH - wScrollTop - wHeight;


    function stopAsideScroll() {

        if ( asideOfsB < footerH + 2 ) {


            console.log('now the script should start');


        } //end if

    } //stopAsideScroll


    //if screen is wide enough so that the sidebar is there
    if( $(window).width() > 840 ) {


        if( wScrollTop > 376 ) {
            $aside.css({ 'transform' : 'translateY('+ (wScrollTop - 376) +'px)' });

            //stop scrolling if it reaches footer
            stopAsideScroll();
        } else {
            $aside.css({ 'transform' : 'translateY(0)' });
        }


        //if screen is smaller disable
    } else {
        $aside.css({ 'transform' : 'translateY(0)' });
    }


} //scr aside

提前感谢为我修复此问题的人! :)

0 个答案:

没有答案