在通常的网站开发中，页面有时候会很长，尤其是一些电商网站，为了提高用户的体验效果，我们通常会增加一个回到顶部的按钮，这个按钮我们同城会使用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. 第五章 .net core该怎么玩

    项目目标部署环境:CentOS 7+ 项目技术点:.netcore2.0 + Autofac +webAPI + NHibernate5.1 + mysql5.6 + nginx 开源地址:https ...

  2. springboot中加分布式redis锁

    分布式redis锁,spring-boot-starter-data-redis,RedisTemplate 公司聊天的聊天系统,近期出现多个客服并发接待同一个客户的记录,经排查,是由于代码加的同步锁 ...

  3. Kali Linux Web渗透测试手册(第二版) - 1.1 - Firefox浏览器下安装一些常用的插件

    一．配置KALI Linux和渗透测试环境 在这一章,我们将覆盖以下内容: l  在Windows和Linux上安装VirtualBox l  创建一个Kali Linux虚拟机 l  更新和升级Ka ...

  4. react 项目全家桶构件流程

    资源:create-react-app.react.react-dom.redux.react-redux.redux-thunk.react-router-dom.antd-mobile/antd. ...

  5. hdoj1009 FatMouse' Trade——贪心算法

    贪心思路:按单位猫粮能兑换到的javaBean从大到小将组合进行排序,总是在当前兑换尽可能多的javabeans 问题描述:点击打开链接 hdoj1009 FatMouse's Trade 源代码: ...

  6. spring源码深度解析— IOC 之 bean 创建

    在 Spring 中存在着不同的 scope,默认是 singleton ,还有 prototype.request 等等其他的 scope,他们的初始化步骤是怎样的呢?这个答案在这篇博客中给出. s ...

  7. shell 循环打印某一天后的n天的日期

    #!/bin/bash start_date="2017-10-26" for i in `seq 0 30` do num=$((${i}+1)) datatime=`date ...

  8. 并发编程-concurrent指南-阻塞队列-优先级的阻塞队列PriorityBlockingQueue

    PriorityBlockingQueue是一个支持优先级的无界阻塞队列. 它使用了和类 java.util.PriorityQueue 一样的排序规则.你无法向这个队列中插入 null 值. 所有插 ...

  9. Docker-Compose搭建单体SkyWalking

    SkyWalking简介 SkyWalking是一款高效的分布式链路追踪框架,对于处理分布式的调用链路的问题定位上有很大帮助 有以下特点: 性能好 针对单实例5000tps的应用,在全量采集的情况下, ...

  10. Codeforces 758B：Blown Garland（模拟）

    http://codeforces.com/problemset/problem/758/B 题意:给出一个字符串,每4个位置对应一个颜色,如果为‘!’的话,代表该灯泡是坏的,问最后每个颜色坏的灯泡的 ...