1. <script>
  2. window.onload = function(){
  3. var oTop = document.getElementById("to_top");
  4. var screenw = document.documentElement.clientWidth || document.body.clientWidth;
  5. var screenh = document.documentElement.clientHeight || document.body.clientHeight;
  6. oTop.style.left = screenw - oTop.offsetWidth +"px";
  7. oTop.style.top = screenh - oTop.offsetHeight + "px";
  8. window.onscroll = function(){
  9. var scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
  10. oTop.style.top = screenh - oTop.offsetHeight + scrolltop +"px";
  11. }
  12. oTop.onclick = function(){
  13. document.documentElement.scrollTop = document.body.scrollTop =0;
  14. }
  15. }
  16.  
  17. </script>
  1. <div id="to_top">返回顶部</div>

js 返回顶部的更多相关文章

  1. js返回顶部封装 简洁

    js返回顶部封装 简洁: 加入html页面body最后面即可. <script> a(); function a() { $(function() { if ($(".j-to- ...

  2. js返回顶部效果

    当用户浏览的网页过于长的时候,用户在浏览到网页底部想要在返回顶部需要滚动好几次滚轮才能返回顶部,不仅麻烦,而且用户体验也会很差.现在的大多是页面都会在页面顶部或者是页面的可见区域的某一位置固定一个按钮 ...

  3. 原生js返回顶部(匀速、由快到慢)

    在项目中我们经常有需求要求页面滚动到一定位置时出现返回顶部按钮,点击即返回顶部. 方法一: 锚点,这是最简单的.(a标签的href属性等于一直要到达位置元素的id值) 方法二: js直接给页面根节点设 ...

  4. 原生JS返回顶部,带返回效果

    有些网站当滑到一定高度时右下角会有一个按钮,你只要一点就可以直接返回顶部了.那这个功能是怎么做到的呢.其实不算太难: 首先我们先在网页中创建一个按钮,上面写上返回顶部,把它的样式改成固定定位,之后想要 ...

  5. js返回顶部小Demo

    <style> .divH { height: 1800px; } .divT { width: 50px; height: 50px; font-size: 18px; backgrou ...

  6. js返回顶部

    1. function scrollTop(){ $(},); } 2. $("#side-bar .gotop").click(function(){ $(},); //返回顶部 ...

  7. 原生js返回顶部

    let backToTop = function() { let scrollToptimer = setInterval(function() { let top = document.body.s ...

  8. 详解原生JS回到顶部

    第一次知道可以用超链接(锚点)实现回到顶部的时候我是很震惊的,想着原来可以这么简单啊!但是作为一个正在学习JS的小白,不能就这么轻易止步,所以查资料自己整了一个JS返回顶部. HTML代码: ? 1 ...

  9. js实现返回顶部功能的解决方案

    很多网站上都有返回顶部的效果,主要有如下几种解决方案. 1.纯js,无动画版本 window.scrollTo(x-coord, y-coord); window.scrollTo(0,0); 2.纯 ...

随机推荐

  1. Spring.Boot.1 -- 概览

    Spring Boot 是如何简化Java 开发的 SpringBoot的一些重要特征 长久以来,Spring 框架作为Java应用开发的框架地位稳固.最近在云计算.大数据.无结构数据持续化.函数式反 ...

  2. [Python3网络爬虫开发实战] 2.3-爬虫的基本原理

    我们可以把互联网比作一张大网,而爬虫(即网络爬虫)便是在网上爬行的蜘蛛.把网的节点比作一个个网页,爬虫爬到这就相当于访问了该页面,获取了其信息.可以把节点间的连线比作网页与网页之间的链接关系,这样蜘蛛 ...

  3. 树莓派 - 通过sysfs操控GPIO

    点亮或熄灭LED 硬件上,一个LED灯接在pi的Pin-25.  该引脚为BCM的GPIO26 $ gpio readall +-----+-----+---------+------+---+--- ...

  4. Reparameterization Trick

    目录 Sample() is not differentiable Reparameterization trick Too Complex Sample() is not differentiabl ...

  5. list嵌套,int与str的用法,replace

    #*************************replace(待改,改动值),返回很重要 A = [['libai',89]] A[0][0]=A[0][0].replace('a','af') ...

  6. SpringBoot第十六篇:自定义starter

    作者:追梦1819 原文:https://www.cnblogs.com/yanfei1819/p/11058502.html 版权声明:本文为博主原创文章,转载请附上博文链接! 前言   这一段时间 ...

  7. hadoop_exporter+prometheus

    1.准备工作 安装go.glibe(需要连google服务器,咋连的,我就不写了,因为尝试了各种办法,都失败了,很伤心) 2.下载hadoop_exporter cd /usr/local/prom/ ...

  8. 【CodeChef】KNGHTMOV(方案数DP)

    题意: 考虑一张无限大的方格棋盘.我们有一个“骑士”,它必须从(0,0)格开始,按照如下规则,移动至(X,Y)格:每一步,它只能从(u,v)格移动至(u+Ax,v+Ay)或者(u+Bx,v+By).注 ...

  9. ajax分页查询信息的通用方法

    1.页面准备分页的表格与分页div 同时需要在查询条件表单中准备隐藏当前页与页大小的文本框 <div class="container-fluid"> <div ...

  10. runOnUiThread在子进程中更新主进程UI

    package com.pingyijinren.test; import android.support.v7.app.AppCompatActivity; import android.os.Bu ...