<!DOCTYPE html>

<html>

    <head>

        <title>返回顶部</title>

        <meta charset="utf-8" />

        <script type="text/javascript" src="jquery-1.8.2.js"></script>

        <style type="text/css">

            body{

                height:2000px;

            }

            #scrollTop{

                position:fixed;

                width:36px;

                height:65px;

                bottom:100px;

                right:100px;

                text-align:center;

                background:url("images/7.png");

                color:#FFF;

                font-size:12px;

                cursor:pointer;

                display:none;

            }

            #scrollTop:hover{

                background-position:0px -66px;

            }

        </style>

    </head>

    <body>

        <div id="scrollTop"></div>  

        <script type="text/javascript">

            $(window).scroll(function(){

                if($(window).scrollTop()<=){

                    $("#scrollTop").fadeOut();

                }else{

                    $("#scrollTop").fadeIn();

                }

            })

            $("#scrollTop").click(function(){

                 $('body,html').animate({scrollTop:},);

            })

        </script>

    </body>

</html>

JavaScript/Jquery返回顶部代码的更多相关文章

  1. jQuery返回顶部代码

    页面较长时,使用返回顶部按钮比较方便,在电商中必备操作.下面自己制作一个js文件,totop.js,把它直接引用到需要的网页中即可. $(function () { $("body" ...

  2. jQuery返回顶部代码组件

    非原创,拿来修改,样式可自定义,div,img都可以,效果如下: 下载地址:http://files.cnblogs.com/files/EasonJim/jquery.topback.rar 项目相 ...

  3. jQuery火箭图标返回顶部代码

    在网上找来段使用jQuery火箭图标返回顶部代码,感觉比较酷,比较炫,大概样式如下, 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...

  4. qq空间返回顶部代码

    点击这里体验效果 以下是源代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  5. jquery返回顶部，支持手机

    jquery返回顶部,支持手机 效果体验:http://hovertree.com/texiao/mobile/6/ 在pc上我们很容易就可以用scrollTop()来实现流程的向上滚动的返回到顶部的 ...

  6. jQuery返回顶部（精简版）

    jQuery返回顶部(精简版) <!DOCTYPE html><html lang="en"><head> <meta charset=& ...

  7. 在线运行Javascript,Jquery,HTML,CSS代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xht ...

  8. 使用Javascript实现返回顶部功能。

    为了提高网站的浏览体验及友好度,相信大部分网站需要一个返回顶部的按钮,如果使用传统的a标记,再做一个div加上链接的话,非常麻烦,不仅每个页面都需要添加,而且不能实现非常智能的效果及简化维护时间. 下 ...

  9. css 简单 返回顶部 代码及注释说明

    1. 最简单的静态返回顶部,点击直接跳转页面顶部,常见于固定放置在页面底部返回顶部功能 方法一:用命名锚点击返回到顶部预设的id为top的元素 html代码 <a href="#top ...

随机推荐

  1. AGC 016 C - +/- Rectangle

    题面在这里! 结合了贪心的构造真是妙啊2333 一开始推式子发现 权是被多少个w*h矩形覆盖到的时候 带权和 <0 ,权都是1的时候带权和 >0,也就是说被矩形覆盖的多的我们要让它尽量小. ...

  2. BZOJ 2738 矩阵乘法（整体二分+二维树状数组）

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=2738 [题目大意] 给出一个方格图,询问要求求出矩阵内第k小的元素 [题解] 我们对答 ...

  3. Smart config风险分析与对策

    Smart config风险分析与对策 1.简介:          Smart config是一种将未联网设备快速连接wifi的技术,大概原理如下图所示: 2.业务需求:          要求实现 ...

  4. Word中正文两栏表格通栏排版

    如图所示,需要在插入表格的地方插入连续分节符,这是word2013,在插入里面只有分页符 如果直接插入的话表格上下的分节符会分栏,那样表格会歪曲, 可以上面一段和下面一段设置成通栏,然后中间插入表格, ...

  5. Android关于JSON数据解析

    一.什么是json json(Javascript Object Notation)是一种轻量级的数据交换格式,相比于xml这种数据交换格式来说,因为解析xml比较的复杂,而且需要编写大段的代码,所以 ...

  6. jQuery.extend重载合并

    使用: var people1 = { apple: 0, banana: { weight: 52, price: 100 }, age: 97 }; var people2 = { banana: ...

  7. AS3.0纯代码编写的两款loading效果

    AS3.0纯代码编写的两款loading效果 效果一 效果二 代码很简单,实现的原理一样,只不过矩形用到了Matrix类,对注册点进行了调整,效果可用于视频播放器缓冲时的loading效果,下面看代码 ...

  8. 二.Consumer、Producer简单例子

    1.先导入jar包,我使用的是maven <dependency> <groupId>com.alibaba.rocketmq</groupId> <arti ...

  9. windows环境phpstorm调试环境搭建

    一:安装设置xdebug 这个一般有两个步骤1:浏览器的xdebug插件安装,一般用firefox的插件,chrome好像不太好使,chrome安装后的  效果 安装后如下图所示,需要配置IDEKEY ...

  10. Make Menuconfig详解 （配置内核选择）

    Make Menuconfig简介 make menuconfig 图形化的内核配置make mrproper -----删除不必要的文件和目录. #make config(基于文本的最为传统的配置界 ...