zoukankan      html  css  js  c++  java
  • JS 回到顶端 back to top

    CSS:
    .backtoTop2{
        height: 40px;
         50px;
        position: fixed;     
        padding-top: 8px;
        right: 100px;
        z-index: 9999;
        background: red;
        cursor: pointer;
        text-align: center;
    }
    
    JS:
    $(document).ready(function(){
        $(window).scroll( function() {                    // change scroll event
            var height = $(window).height(),          //get window height
                  top = $(document).scrollTop();       //get scroll top
            if(top > height ){                                    //more than height to show
                $("#backToTop2").fadeIn(300).css({
                    top: height-80
                });
            }
            if(top < height ){                                   //less than height to disappear
                $("#backToTop2").fadeOut(200);
            }
        });
        /*back to top click*/
        $('#backToTop2').click(function(){
            $('html, body').animate({                     // Animation effects --> move
                scrollTop: 0
            }, 500);
        });
    });
      
    HTML:
    <divid="backToTop2"class="backtoTop2"></div>
    

      

  • 相关阅读:
    缅怀
    74LS164的使用
    跑步
    Datasheet,你会读么?[转]
    清华附小给的书单
    iOS-小知识
    网络-GET&POST
    网络-基础
    网络-HTTP其他常见方法
    数据解析
  • 原文地址:https://www.cnblogs.com/zwcai/p/7619816.html
Copyright © 2011-2022 走看看