效果请看右下角:代码如下:

<div class="totop">
<img src="https://www.cnblogs.com/images/cnblogs_com/aiwuxia/1249780/o_replay_tophover.jpg" alt="">
</div>
<script>


var topMain=$(".head").height()
$(window).scroll(function(){


if ($(window).scrollTop()>topMain){
$(".totop").slideDown(500);
}
else{
$(".totop").slideUp(500);
}
});
$(".totop").click(function(){$("body,html").animate({scrollTop:0},500)});
</script>

 

jqury点击返回顶部代码的更多相关文章

  1. qq空间返回顶部代码

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

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

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

  3. vue点击返回顶部插件vue-totop

    vue-totop vue 点击返回顶部插件,可以根据参数设定按钮大小,颜色,类型,返回顶部的时间等.github地址:https://github.com/1006008051/vue-totop, ...

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

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

  5. jQuery-点击返回顶部

    在页面上,有时需要点击某个图标钮实现返回顶部的效果. 实现方式如下,给图标按钮增加名叫goTop-hook的类. // 点击返回顶部 $(window).scroll(function() { if ...

  6. js中点击返回顶部

    window.scrollTo(0, 0);当点击返回顶部的时候调用这个方法即可 handleScrollTop(){ window.scrollTo(0, 0); }

  7. [html][转]常用返回顶部代码

    转至:http://jingyan.baidu.com/article/7082dc1ca6b928e40a89bd1a.html 一.使用HTML的锚标记最简单了 但是唯一的缺点就是样式不怎么样,会 ...

  8. 在页面中有overflow-y:auto属性的div,当出现滚动条,点击返回顶部按钮,内容回这个div最顶部

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. jQ 移动端返回顶部代码整理

    //返回顶部 $('#btn-scroll').on('touchend',function(){ var T = $(window).scrollTop(); var t = setInterval ...

随机推荐

  1. CF1045B Space Isaac(乱搞)

    翻译 有0~m-1的数被分成了两个集合每次你可以从两个集合中任取一个数做加法并对m取模问最后0~m-1中不能被组合出来的数有多少个会给出你A集合 大小不超过200000m<=1e9 完了题解都看 ...

  2. [Xcode 实际操作]六、媒体与动画-(3)使用CoreImage框架设置图片的单色效果

    目录:[Swift]Xcode实际操作 本文将演示如何使用图片框架,将图片转换成单色样式. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit ...

  3. Centos下磁盘管理的常用命令记录(如查找大文件)

    Centos下磁盘管理的常用命令记录 查看系统磁盘空间占用,使用命令: df -h 结果: 查看磁盘inode使用情况,如果inode用完了,磁盘就没法写入新的内容了: df -i 结果: 如何查找磁 ...

  4. JQuery扩展和事件

    一.jQuery事件 常用事件 blur([[data],fn]) 失去焦点 focus([[data],fn]) 获取焦点( 搜索框例子) change([[data],fn]) 当select下拉 ...

  5. Django (十三) 项目部署 3

    阿里云项目部署 部署Django项目   1, 配置nginx 1.1 进入:cd /var/www, 将外面压缩好的AXF项目拖入xshell中,并解压 1.2 配置nginx.conf: 将htt ...

  6. Netty(7-2)传List

    ObjectEchoServer protected void initChannel(SocketChannel ch) throws Exception { ChannelPipeline p = ...

  7. NET Core应用可以同时运行在Windows Container和Linux Container-1

    NET Core多平台开发体验[1]: Windows 微软在千禧年推出 .NET战略,并在两年后推出第一个版本的.NET Framework和IDE(Visual Studio.NET 2002,后 ...

  8. java preparement

    1.建立链接 Connection conn = getDataSource().getConnection(); PreparedStatement ps = null; 2不自动 Commit 不 ...

  9. 《四 spring源码》手写springmvc

    手写SpringMVC思路 1.web.xml加载  为了读取web.xml中的配置,我们用到ServletConfig这个类,它代表当前Servlet在web.xml中的配置信息.通过web.xml ...

  10. linux创建文件的四种方式(其实是两种,强行4种)

    linux创建文件的四种方式: 1.vi newfilename->i->编辑文件->ESC->:wq! 2.touch newfilename 3.cp sourcePath ...