在通常的网站开发中，页面有时候会很长，尤其是一些电商网站，为了提高用户的体验效果，我们通常会增加一个回到顶部的按钮，这个按钮我们同城会使用fixed定位，将其定位在当前可视区域某一固定位置。这个效果用jQuery来实现的时候，非常简单。

　　

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

     $(window).scrollTop(0);

 })

 //点击id名为toTopBtn按钮，页面回到顶部

jQuery写toTop(回到顶部)效果的更多相关文章

  1. jquery实现"跳到底部"，"回到顶部"效果

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

  2. JS实现回到顶部效果

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

  3. 用Javascript实现回到顶部效果

    用Javascript实现回到顶部效果 经常看到网页中有回到顶部的效果,今天也研究一下回到顶部有哪些方法.众所周知,用锚链接是实现回到最简单的方法,但是从用户体验效果来说,并不是最好的.(锚链接回到顶 ...

  4. javascript 特效实现(2)——回到顶部效果

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

  5. 页面滚动事件和利用JS实现回到顶部效果

    页面滚动 事件:window.onscroll, 获得页面滚动位置:document.body.scrollTop: HTML代码: 这里注意此处逻辑,大于500就显示,否则就隐藏,还有注意如果变量名 ...

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

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

  7. JS原生回到顶部效果

    // 回到顶部 onload = function () { var oBtnTop = document.getElementById('toTop'); var timer = null; oBt ...

  8. jquery点击回到顶部

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

  9. javascript 回到顶部效果的实现

    demo.js window.onload=function() { var timer=null; var obtn=document.getElementById('btn'); var isTo ...

随机推荐

  1. 深入理解Java虚拟机（字节码执行引擎）

    深入理解Java虚拟机(字节码执行引擎) 本文首发于微信公众号:BaronTalk 执行引擎是 Java 虚拟机最核心的组成部分之一.「虚拟机」是相对于「物理机」的概念,这两种机器都有代码执行的能力, ...

  2. ElasticStack学习（二）：ElasticStack安装与运行

    一.ElasticSearch的安装与运行 1.由于ElasticSearch是由Java语言开发的,若要运行ElasticSearch,需要安装并配置JDK,并要设置$JAVA_HOME环境变量. ...

  3. vue的懒加载如何实现？

    个人通过查找发现一个比较好用的模块,vue-lazyload 第一步 下载安装这个包    npm install vue-lazyload 第二步 在main.js中引入这个模块 import Vu ...

  4. 简单的scrapy实例

    前天实验室的学长要求写一个简单的scrapy工程出来,之前也多少看了点scrapy的知识,但始终没有太明白,刚好趁着这个机会,加深一下对scrapy工作流程的理解.由于临近期末,很多作业要做(其实.. ...

  5. 【POJ - 2386】Lake Counting （dfs+染色）

    -->Lake Counting 直接上中文了 Descriptions: 由于近日阴雨连天,约翰的农场中中积水汇聚成一个个不同的池塘,农场可以用 N x M (1 <= N <= ...

  6. Java web导出word，文件名为中文，%E6%9D%90%E8%B4%A8%E5%8D%95乱码

    因为文件名为中文,导出时会有乱码问题 原代码: String fileName = "文件名.doc"; response.setHeader("Content-Disp ...

  7. 项目心得——mybatisplus注解

    最近在做的项目中使用了mybatisplus,遇到了一些小问题,特此记录. 1.在sql查询后返回的数据中,会存在一些实体类中本没有的字段: 遇到这个问题时,我理所当然的就去实体类中添加了这个字段,但 ...

  8. 控制反转&依赖注入

    IoC(Inversion of Control,控制反转).这是spring的核心,贯穿始终.所谓IoC,对于spring框架来说,就是由spring来负责控制对象的生命周期和对象间的关系.这是什么 ...

  9. [NOIP2003] 传染病控制题解

    问题 F: [NOIP2003] 传染病控制 时间限制: 1 Sec  内存限制: 128 MB 题目描述 [问题背景] 近来,一种新的传染病肆虐全球.蓬莱国也发现了零星感染者,为防止该病在蓬莱国大范 ...

  10. CF1194D 1-2-K Game (博弈论)

    CF1194D 1-2-K Game 一道简单的博弈论题 首先让我们考虑没有k的情况: 1. (n mod 3 =0) 因为n可以被分解成若干个3相加 而每个3可以被分解为1+2或2+1 所以无论A出 ...