function backTop() {
$(window).scroll(function () {
if ($(window).scrollTop() > 100) {
$("#topImg").fadeIn(1000);
}
else {
$("#topImg").fadeOut(1000);
}
}); //当点击跳转链接后,回到页面顶部位置
$("#topImg").click(function () {
    //考虑到兼容性使用 body 和 html
$('body,html').animate({ scrollTop: 0 }, 800);
return false;
});
}

  CSS 样式和HTML中的跳转图片设置如下:

#topImg{
position:fixed;
right:15px;
bottom:30px;
display:none;
} <img id="topImg" src="../images/top.PNG" />

  

使用 jQuery 页面回到顶部的更多相关文章

  1. js——页面回到顶部

    很久都没有去慕课网学习学习了,刚恰好就看见了一个用的比较多的小例子——页面回到顶部,记得之前自己也是在初学web时,被这个坑了一回,因此今天特地拿来分享分享…… <!DOCTYPE html&g ...

  2. jQuery滚动条回到顶部或指定位置

    jQuery滚动条回到顶部或指定位置 在很多网站,为了增强用户体验,我们会看到回到顶部的按钮,不用手动拖拽滚动条就能回到顶部,非常方便.下面就介绍用jquery实现的滚动到顶部的代码 $(functi ...

  3. jQuery实现页面回到顶部功能

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  4. 【JQ+锚标记实现点击页面回到顶部】

    前言:今天想写个页面常用到的[点击回到页面顶部或是首页的功能],生活和职场一样,总会有低谷的时候,这个时候咱也别怂.别怂.别怂,说三遍!那都不是事,工作没了,再找呗,就像我上周五,团队解散那天,我是笑 ...

  5. 自写jquery网页回到顶部效果,渐隐图标,引用js文件就可以

    唔.进来开发需求,当网页内容草鸡多的时候,用户就须要有个button高速回到顶部,而不是自己去滚滑轮~ 原本以为比較难的说,由于上头要求所实用js来实现,哪个页面引用,哪个页面显示. 于是乎,本屌丝就 ...

  6. jquery javascript 回到顶部功能

    今天搞了一个回到顶部的JS JQ功能 (function($){ $.fn.survey=function(options){ var defaults={width:"298", ...

  7. jQuery之回到顶部

    实现回到顶部的功能,根据学了元素滚动实现,温习知识点. 做之前先理清一下步骤和思路: 1.获得页面的滚动长度 var $page = $("html,body"); var dis ...

  8. jQuery实现“回到顶部”按钮功能

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

  9. jQuery-使页面回到顶部

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

随机推荐

  1. 模仿QQ左滑删除

    需求: 1.左滑删除 2.向左滑动距离超过一半的时候让它自动滑开,向右滑动超过一半的时候自动隐藏 3.一次只允许滑开一个item 还有,根本不需要自定义view来实现,谨防入坑 布局: <?xm ...

  2. 数值的三种表示--C语言

    在C语言中,数值常数可以是3中形式: (1)在数值前面加0表示的是8进制数据: (2)在数字前面加0x表示的是16进制数: (3)在数值前面什么也不加,表示的是10进制数值.        目前C语言 ...

  3. 配置.net连接数据库的配置文件

    今天调试一个学生信息管理系统时,启动系统之后,登录时老是报错说实例有问题,拿着报错信息去找方法也没遇到能解决问题的,最后怀疑是数据库配置和配置文件不匹配, 发现自己的数据库里并没有SQLEXPRESS ...

  4. Web Service \restful web services\WCF Service\ServiceStack

    http://www.cnblogs.com/jfzhu/p/4025448.html http://www.cnblogs.com/jfzhu/p/4022139.html#3043243

  5. BFS(八数码) POJ 1077 || HDOJ 1043 Eight

    题目传送门1 2 题意:从无序到有序移动的方案,即最后成1 2 3 4 5 6 7 8 0 分析:八数码经典问题.POJ是一次,HDOJ是多次.因为康托展开还不会,也写不了什么,HDOJ需要从最后的状 ...

  6. PHP、Java对称加密中的AES加密方法

    PHP AES加密 <?php ini_set('default_charset','utf-8'); class AES{ public $iv = null; public $key = n ...

  7. HIT2715 Matrix3(最小费用最大流)

    题目大概说有一个n×n的矩阵,每个格子都有权值和高度,在这个矩阵中进行最多k次旅行,每次旅行能从当前格子走到相邻且高度更小的格子,走到格子边界就能出去完成这次旅行.每走到一个格子就累加格子的权值然后把 ...

  8. Hadoop 分布式环境搭建

    一.前期环境 安装概览 IP Host Name Software Node 192.168.23.128 ae01 JDK 1.7 NameNode, SecondaryNameNode, Data ...

  9. Backbone.js学习之二

    经历一段自我修炼,终于领悟到Backbone.js的关键知识点,也发现了原来MVC可以在前端这样梦幻的发挥,Backbone.js确实是一个很有魅力的前端MVC框架. 练就一门技术,需要有扎实的功底, ...

  10. python 代码片段25

    #coding=utf-8 # 虽然python是面向对象的语言,但是没有显式的构造函数概念. # python没有new关键词 class MyClass(object): pass m=MyCla ...