Javascript make sidebar “scroll” with the page until its bottom edge hits footer

孤街醉人 提交于 2019-12-08 07:33:28

问题


Javascript make sidebar "scroll" with the page until its bottom edge hits footer. The point is that I have this sidebar that should scroll along with the page and stop when its bottom edge hits the top edge of footer - after that point it should behave by default(be static again), which can be seen here: http://zakuvavanje.rs/ . This question is similar to this one jQuery scrolling DIV: stop scrolling when DIV reaches footer , I didn't want to ask the question, however I had no idea how to make it happen, the script should go where I put

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

P.S. the problem is for smaller screens so please set viewport to 1366x768 or less to see the issue. Here's the pastebin for my script: http://pastebin.com/8anjKR1d , and here's the same script here:

//"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

Thanks in advance for whoever fixes this for me!!! :)

来源:https://stackoverflow.com/questions/39436074/javascript-make-sidebar-scroll-with-the-page-until-its-bottom-edge-hits-footer

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!