jquery实现向下滚动显示返回顶部按钮点击返回回弹效果代码-html代码-BFW代码库

jquery实现向下滚动显示返回顶部按钮点击返回回弹效果代码

代码语言：html

代码描述：jquery实现向下滚动显示返回顶部按钮点击返回回弹效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

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

<head>
    <meta charset="utf-8">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
    <style>
        *{    -webkit-box-sizing: border-box;    -moz-box-sizing: border-box;    -ms-box-sizing: border-box;    -o-box-sizing: border-box;    box-sizing: border-box;    padding: 0;    margin: 0;    }
            /* Start Div Top */
        .scrollTop_top {
            position: fixed;
            bottom: 30px;
            right: 30px;
            width: 60px;
            height: 60px;
            text-align: center;
            background: #3E5D6B;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            -ms-border-radius: 5px;
            -o-border-radius: 5px;
            border-radius: 5px;
            overflow: hidden;
            cursor: pointer;
            display: none;
        }
        
        .scrollTop_top:hover {
            -webkit-transition: .5s linear;
            -moz-transition: .5s linear;
            -ms-transition: .5s linear;
            -o-transition: .5s linear;
            transition: .5s linear;
            -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.23);
            -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.23);
            -ms-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.23);
            -o-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.23);
            box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.23);
        }
        
        .scrollTop_top i {
            color: #fff;
        }
        
        /* End Div Top */
        /* Start Section */
        .scrollTop_section {
            height: 300px;
            text-align: center;
            line-height: 300px;
            -webkit-transition: .5s ease;
            -moz-transition: .5s ease;
            -ms-transition: .5s ease;
            -o-transition: .5s ease;
            transition: .5s ease;
        }
        
        .scrollTop_section:hover {
            -webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.2) inset;
            -moz-box-shadow: 0 0 50px rgba(0, 0, 0, 0.2) inset;
            -ms-box-shadow: 0 0 50px rgba(0, 0, 0, 0.2) inset;
            -o-box-shadow: 0 0 50px rgba(0, 0, 0, 0.2) inset;
            box-shadow: 0 0 50px rgba(0, 0, 0, 0.2) inset;
        }
        
        .scrollTop_section:first-of-type {
            background-color: #F8BBD0;
        }
        
        .scrollTop_section:nth-of-type(2) {
            background-color: #DCEDC8;
        }
        
        .scrollTop_section:nth-of-type(3) {
            background-color: #B3E5FC;
        }
        
        .scrollTop_section:nth-of-type(4) {
            background-color: #C5CAE9;
        }
        
        .scrollTop_section:nth-of-type(5) {
            background-color: #FCF6B3;
        }
        
        .scrollTop_section:last-of-type {
            background-col.........完整代码请登录后点击上方下载按钮下载查看