首页 前端知识 JS特效第40弹:jQuery返回顶部插件弹性动画

JS特效第40弹:jQuery返回顶部插件弹性动画

2024-08-25 23:08:02 前端知识 前端哥 489 904 我要收藏

        jquery实现的带反弹动画效果返回顶部插件,jquery网页右下角返回顶部按钮,设计美观大气,先来看看效果:

        一部分关键的代码如下:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>jQuery返回顶部插件弹性动画</title>
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <link rel="stylesheet" href="css/demo.css">
    <link rel="stylesheet" href="css/scrollTop_iconStyle.css">
    <link rel="stylesheet" href="css/scrollTop_bgStyle.css">
</head>

<body>

    <!--    Start Sections    -->
    <section class="scrollTop_section"><h1>Section 1</h1></section>
    <section class="scrollTop_section"><h1>Section 2</h1></section>
    <section class="scrollTop_section"><h1>Section 3</h1></section>
    <section class="scrollTop_section"><h1>Section 4</h1></section>
    <section class="scrollTop_section"><h1>Section 5</h1></section>
    <section class="scrollTop_section"><h1>Section 6</h1></section>
    <!--    End Sections    -->
    <!--    Start Div Scroll    -->
    <div class="scrollTop_top">
        <i class="fa fa-angle-double-up fa-4x"></i>
    </div>
    <!--    End Div Scroll    -->

    <script src="js/jquery-1.12.1.min.js"></script>
    <script src="js/scrollTop_script.js"></script>
</body>

</html>

        全部代码:jQuery返回顶部插件弹性动画.zip

转载请注明出处或者链接地址:https://www.qianduange.cn//article/16910.html
标签
评论
发布的文章

安装Nodejs后,npm无法使用

2024-11-30 11:11:38

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!