由于项目中要用到,遂记录下来
用JQuery实现 锚标记平滑移动
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <title>锚标记平滑移动</title>
-
- </head>
-
- <body>
- <div id="top" >
- 顶部 <a href="#bottom" class="smooth">移动到底部</a>
- </div>
- <div id="appendBox">
-
- </div>
- <div id="bottom" >
- 底部 <a href="#top" class="smooth">移动到顶部</a>
- </div>
-
- <script src="jquery-1.4.2.min.js"type="text/javascript"></script>
- <script type="text/javascript">
- $(".smooth").click(function(){
- var href = $(this).attr("href");
- var pos = $(href).offset().top;
- $("html,body").animate({scrollTop: pos}, 1000);
- return false;
- });
- </script>
- </body>
- </html>