js小效果：返回頂部 scrollTop 。 滾屏：animate

 

返回頂部：

（scroll 滾屏事件，如果超出第一屏，顯示返回頂部的按鈕）

<div id="gotop" onclick="javascript:scroll(0,0);"><img src="images/top33x33.png"></div>
<style type="text/css">
#gotop{display:none;position:fixed;right:5px;bottom:4rem;width:33px;height:33px;z-index:999;}
</style>
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
    $(window).scroll(function() {//滾屏
        var scrollTop = $(document.body).scrollTop();//滾動高度
        var windowH = $(window).height();//頁面高度
        if(scrollTop>windowH){
            $("#gotop").show();
        }else{
            $("#gotop").hide();
        }
    });
});
</script>

 

屏幕滾動到某個像素處：2015-11-18

var scrollTop = $(this).offset().top;
$(document.body).scrollTop(scrollTop-50);

 

返回頂部、返回頁面頂部：　　2016-4-22

$('.sidebarnav .sbnl-gotop').click(function(){//回到頂部
    $(document.body).animate({scrollTop: '0px'}, 800);
});

 

側導航的顯示隱藏：（要求，滾屏超過100px后，顯示側導航。初始狀態下不顯示側導航）　　2016-4-22

/* 側導航 */
$(window).scroll(function() {//滾屏
    var scrollTop = $(document.body).scrollTop();//滾動高度
    //var windowH = $(window).height();//頁面高度
    if(scrollTop>100){
        $('.sidebarnav').show();
    }else{
        $('.sidebarnav').hide();
    }
});

 

 

..