博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【原创】回到头部 jquery+css3
阅读量:7059 次
发布时间:2019-06-28

本文共 707 字,大约阅读时间需要 2 分钟。

hot3.png

效果如图:

<!--回到头部 开始-->

<style>
    .go-btn{ 
        position: fixed; 
        right: 20px; 
        bottom: 20px; 
        width: 30px; 
        height: 30px; 
        color:#fff;
        line-height: 30px;
        text-align: center;
        font-size: 12px;
        border-radius: 15px; 
        background: rgba(0,0,0,.5);
        transition: 0.5;
        cursor: pointer;

        /*过渡*/

        -webkit-transition-duration:0.2s;
        -webkit-transition-timing-function:ease-out;

        }

    .go-btn:hover{ 
        background: rgba(0,0,0,.9);
        -webkit-transform:scale(1.2);
        -moz-transform:scale(1.2);
        -o-transform:scale(1.2);
    }
</style>
<script type="text/javascript">
    $(function(){
        $(".go-btn").click(function(){
             $("html,body").animate({scrollTop:$("#logo_row").offset().top},500)
        }) 
    })
       
</script>
<!--回到头部 结束-->

转载于:https://my.oschina.net/u/583531/blog/862967

你可能感兴趣的文章
在Linux下线程死锁的四个条件
查看>>
linux 基础命令
查看>>
yii中常用路径
查看>>
ASDM在WIN7中不好用?!
查看>>
UIButton用法详解
查看>>
nodejs-mongodb手册
查看>>
空函数有参函数调用参数的注意事项Swift 1.1语言
查看>>
Xamarin SQLite教程数据库访问与生成
查看>>
SQL Server 高可用性(三)共享磁盘
查看>>
SDRAM工作原理
查看>>
老王的spring-boot
查看>>
python中处理中文编码问题
查看>>
在ios上获取wifi的相关信息
查看>>
linux centos 网卡错误 Device eth0 does not seem to
查看>>
Yii项目开发总结
查看>>
通过rsync实现同步
查看>>
看透Objective-C构造方法
查看>>
linux Centos6.5 下python2.6升级到2.7
查看>>
JS,Jquery获取各种屏幕的宽度和高度
查看>>
我的友情链接
查看>>