【第21期】观点:人工智能到底用 GPU?还是用 FPGA?

回到顶部效果 js+css

原创 2016年08月30日 15:42:42

css和js部分:

<style type="text/css">
        body{height:5000px; }
        .top{background-color: #0a131a;color:#fff;width:50px;height:50px;display: none;
            position: fixed;right:20px;bottom:40px;}
    </style>
    <script>
    $(document).ready(function () {
        $(window).scroll(function () {
            if($(document).scrollTop()>=120){
                $(".top").fadeIn(3000);
            }else{
                $(".top").fadeOut(3000);
            }
        });
        $('.top').click(function(){
            $('html,body').animate({scrollTop: '0px'}, 2000);//缓慢回到顶部
        });
    })
    </script>

html部分:

<body >
<div>
    <a href="#" class="top">top</a>
</div>
</body>

另: jq插件 下载传送门:http://pan.baidu.com/s/1geAMIgr

使用方法—
1.引用jquery库和jquery.goup.min.js到你的页面

<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.goup.min.js"></script>

在调用下插件就OK了。

<script type="text/javascript">
        $(document).ready(function () {
            $.goup({
                trigger: 100,
                bottomOffset: 150,
                locationOffset: 100,
                title: 'This is a Demo',
                titleAsText: true
            });
        });
</script>
版权声明:本文为博主原创文章,未经博主允许不得转载。 举报

相关文章推荐

原生js实现淘宝首页回到顶部效果

淘宝首页的回到顶部按钮是这样的:下拉到一定距离后按钮才显示出来,鼠标放到按钮上时,按钮背景会变成灰色,并且图标变成了文字。点击按钮缓慢回到顶部 我们先分析下实现这样的效果需要添加哪些事件。鼠标移进移...

JS回到顶部效果

&lt;%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt; &lt;div class="mod-scroll-top-wr" id="mod-right-menu" style="display:block;"&gt; &lt;a href="###" title="回到顶部" class="mod-sc

back to top 回到顶部按钮 css+js

效果 html p id="back-to-top">a href="#top">span>span>a>p> css p#back-to-top{ positi...

十天学会DIV+CSS(WEB标准)

标准之路首页 CSS版式布局 DIV+CSS教程 <a href="http://www.aa25.c

原生Js回到顶部效果

前言: 使用原生js实现简单的回到顶部效果。需求比较明确:1.显示与隐藏按钮。2.中途再次触发onscroll清除定时器(暂时未实现,希望各位赐教) 代码: 更多文章
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)