[jQuery] scroll event - 스크롤 이벤트 scroll start, scrolling, scroll stop

scroll event - 스크롤 이벤트 scroll start, scrolling, scroll stop

스크롤시 사라졌다가 스크롤 끝나면 다시 나오는 스크립트

https://gist.github.com/RubaXa/5569075

 jquery.event.scroll.js

-- Page 배너 삽입, 모바일 하단에 위치고정

<div id="bottomrollbanner" style="position:fixed; bottom:0; height:49px; width:100%;background-color:bisque;">

                          배너 위치

</div>

<script type="text/javascript">

<!--

$(window).bind('scrollstart scrollend', function (evt){

    if( evt.type == 'scrollstart' ){

        // logic

        console.log("scroll Start");

        jQuery("#bottomrollbanner").fadeOut("fast");

    }

    if( evt.type == 'scrollend' ){

        // logic

        console.log("scroll End");

    jQuery("#bottomrollbanner").fadeIn("slow");

    }

});

var currentScrollTop, temporalScroll = 0;

$(window).scroll(function(){

    currentScrollTop = $(this).scrollTop();

    console.log('Previous value: ' + temporalScroll);

    if (currentScrollTop > temporalScroll) {

        console.log('scroll down - Current value: ' + currentScrollTop);

    }

    else {

        console.log('scroll up - Current value: ' + currentScrollTop);

    }

    temporalScroll = currentScrollTop;

});

//-->

</script>