滚动条替换

最新推荐文章于 2023-02-28 11:43:28 发布

马征不胖

最新推荐文章于 2023-02-28 11:43:28 发布

阅读量506

点赞数

分类专栏：前端小案例01001 文章标签：前端1

本文链接：https://blog.csdn.net/mazheng34340237/article/details/52738082

版权

前端小案例01001 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

今天先说说前端的那些事吧_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

收藏

觉得还不错? 一键收藏
0
评论
滚动条替换

今天先说说前端的那些事吧–滚动条替换 –十一也快结束了陪老婆孩子玩了几天最近一直在考虑是否写写博客，把技术分享给大家。技术无非就是些固有的模式组装在一起实现各种功能，术只要会if和for就可以实现所有的业务功能。其他的就是记些东西罢了—马征说的今天先来点简单的：一下代码为滚动条效果动画。替代掉浏览器自带的href锚点功能。效果很简单。 <!DOCTYPE html><html><h
复制链接

扫一扫