zoukankan      html  css  js  c++  java
  • 锚链接动画

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    
    <body>
    <div id="top" class="append_box mb20">
        平滑跳转到底部:<a href="#bottom" class="smooth">滑到底部</a>
    </div>
    <div id="appendBox" class="append_box">
       <img width="950" height="931" src="http://www.68ecshop.com/images/upload/Image/201407210943470ffuoj.jpg" /><br />
        <img width="950" height="1000" src="http://www.68ecshop.com/images/upload/Image/20140721094432t9j0kt.jpg" />
    </div>
    <div id="bottom" class="append_box mb20">
        平滑回到顶部:<a href="#top" class="smooth">回到顶部链接</a>
    </div>
    
    <script src="http://vscss.com/dm/jquery.js"></script>
    <script>
    $(".smooth").click(function(){
        var href = $(this).attr("href");
        var pos = $(href).offset().top;
        $("html,body").animate({scrollTop: pos}, 1000);
        return false;
    });
    </script>
    </body>
    </html>
  • 相关阅读:
    具有快表的地址变换机构
    npm更换淘宝镜像
    内存扩充技术
    内存管理的概念
    内存的基础知识
    102. 二叉树的层序遍历
    104. 二叉树的最大深度
    206. 反转链表
    mysql 多字段查询,全局搜素
    java 处理html转义字符
  • 原文地址:https://www.cnblogs.com/vscss/p/5634699.html
Copyright © 2011-2022 走看看