jquery滚动事件获取高度,距离顶部的距离,平缓的动画效果

<script>
    var ul_height = $(".self_ul_content").offset().top;//获取距离顶部的高度
    var about = $(".about").offset().top;
    var design = $(".self_designs").offset().top;
    $(window).scroll(function(){
        if($(window).scrollTop()>ul_height){//滚动时距离顶部的高度
            $(".self_ul_content").css({"position":"fixed","top":0,"left":0,"right":0});
        }else{
            $(".self_ul_content").css({"position":"static"});
        }
    })
    $(".self_ul_content ul>li").click(function(){
        var index = $(".self_ul_content ul>li").index(this);
        if(index == 0){
            $('html,body').animate({scrollTop:$(".self_designs").offset().top}, 3000);//点击相应的按钮时,平缓移动到需要显示的地方
        }else{
            $('html,body').animate({scrollTop:$(".about").offset().top}, 3000);
        }
        $(this).addClass("redBg").siblings().removeClass("redBg");
    })
</script>

 

posted @ 2018-06-19 17:39  董七  阅读(355)  评论(0编辑  收藏  举报