1.     <style>
    3.         .div{
    4.             position: relative;
    5.         }
    6.         p{
    7.             width: 100px;
    8.             height: 100px;
    9.             position: absolute;
    10.         }
    11.         #html{
    12.             top: 500px;
    13.             background-color: brown;
    14.         }
    15.         #css{
    16.             top: 1500px;
    17.             background-color: cadetblue;
    18.         }
    19.         #js{
    20.             top: 2500px;
    21.             background-color: cornflowerblue;
    22.         }
    23.     </style>
    24. </head>
    25. <body>
    26.     <div class="a">
    27.         <a href="#html">html</a>
    28.         <a href="#css">css</a>
    29.         <a href="#js">js</a>
    30.     </div>
    31.     <div class="div">
    32.         <p id="html"></p>
    33.         <p id="css"></p>
    34.         <p id="js"></p>
    35.     </div>
    36.     <script>
    37.         $(".a a").click(function(){
    38.             var id = $(this).attr("href");
    39.             var scrollTop =  $(id).offset().top;
    40.             $("html").animate({scrollTop:scrollTop},1000); 
    41.             console.log(scrollTop);
    42.         })
    43.     </script>