滚动条替换

来源：互联网发布：淘宝用图片找商品编辑：程序博客网时间：2024/06/05 07:46

今天先说说前端的那些事吧_mz001-001

–滚动条替换
–十一也快结束了陪老婆孩子玩了几天最近一直在考虑是否写写博客，把技术分享给大家。

技术无非就是些固有的模式组装在一起实现各种功能，术只要会if和for就可以实现所有的业务功能。其他的就是记些东西罢了—马征说的

今天先来点简单的：
一下代码为滚动条效果动画。替代掉浏览器自带的href锚点功能。效果很简单。

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <style type="text/css">        body>div {            width: 300px;            height: 300px;            border: 1px red solid;        }        div#news {            background-origin: padding-box;            background-color: #000000;        }    </style>    <script src="js/jquery.min.js"></script>    <script type="text/javascript">$(document).ready(function($) {    $(".scroll").click(function(event){        event.preventDefault();        $('html,body').animate({scrollTop:$(this.hash).offset().top},900);    });});    </script>    <title></title></head><body><p><a class="scroll" href="#news">scroll</a></p><div></div><div></div><div></div><div class="news" id="news"></div><div></div><div></div></body></html>

0 0