window.onscroll = function () {

    if (document.documentElement.scrollTop + document.body.scrollTop > 100) {

        document.getElementById("scrollto").style.display = "block";

    }

    else {

        document.getElementById("scrollto").style.display = "none";

    }

}

原文https://www.cnblogs.com/youring2/archive/2012/11/21/2780315.html

js隐藏与显示回到顶部按钮的更多相关文章

  1. HTML元素跟随鼠标一起移动,网页中回到顶部按钮的实现

    对象跟随鼠标: 1.对象css设置绝对定位position: absolute; 2.获取鼠标坐标: 3.通过鼠标坐标计算出对象坐标位置,并设置为css定位的位置: document.onmousem ...

  2. 简单地做一下“回到顶部”按钮，用jQuery实现其隐藏和显示

    1.首先,我们要准备HTML代码: <div id="return-top"> <a href="#top">返回顶部</a> ...

  3. 通过HTML+CSS+Javascript实现向下滚动滚动条出现导航栏并出现回到顶部按钮点击按钮回到顶部（一）

    回到顶部实例一 效果:默认隐藏导航栏,当滚动条滚到超过300px后导航栏和按钮出现,点击回到顶部按钮回到顶部,并隐藏导航栏和按钮(导航栏和按钮都是固定定位) <!doctype html> ...

  4. html css jquery 回到顶部按钮

    今天做了个回到顶部的功能,在这里记录一下,有需要可以拿去试试! CSS部分,很简单就一个class /*回到顶部*/ .back-top { position: fixed; right: 15px; ...

  5. Angular回到顶部按钮指令

    之前的分页代码指令化在线下测试没有问题,到服务器上就不运行了,所以那个先放一放. 今天来把"回到顶部"按钮指令化.首先是页面html: <!--回弹按钮--> < ...

  6. 【Android】ListView监听上下滑动（判断是否显示返回顶部按钮

    设置滚动监听判断ListView的滚动方向同时获取屏幕高度.ListView实际高度,判断是否需要展示返回顶部按钮 package com.zihao.activity;   import java. ...

  7. Vue+element UI实现“回到顶部”按钮组件

    介绍 这是一个可以快速回到页面顶部的组件,当用户浏览到页面底部的时候,通过点击按钮,可快速回到页面顶部. 使用方法 由于该组件是基于element-UI进行二次封装的,所以在使用该组件时请务必安装el ...

  8. octopress添加回到顶部按钮

    准备回到顶部的png图片一枚,可以随自己喜好google.分享我的 取名top.png,保存在octopress/source/images/top.png octopress/source/_inc ...

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

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

随机推荐

  1. day006 数字类型和字符串类型的内置方法

    首先,为什么要有数据类型? 对于不同类型的变量,需要用不同的数据类型去描述. 数字类型的内置方法 数据类型又分为整形和浮点型.以下所述的内置方法均适用于这两个类型. 必须掌握的方法*** 数据类型有基 ...

  2. VS 2017 统计项目代码总行数

    编辑 → 查找和替换 → 在文件中的查找,打开查找窗口 填入正则表达式  ^b*[^:b#/]+.*$ 查找范围选“整个解决方案”,勾选上“使用正则表达式” 如果要限制文件类型,就填上要查找的文件类型 ...

  3. Ubuntu安装RTX2080显卡驱动

    安装RTX2080显卡驱动 近日新购了一台DELL服务器,用于TensorFlow,由于显卡是另加的,需要安装显卡驱动. 服务器配置 服务器型号:DELL PowerEdge R730 CPU:2*I ...

  4. NOIP2015 DAY2 T1跳石头

    传送门 题目背景 一年一度的“跳石头”比赛又要开始了! 题目描述 这项比赛将在一条笔直的河道中进行,河道中分布着一些巨大岩石.组委会已经选择好了两块岩石作为比赛起点和终点.在起点和终点之间,有 N 块 ...

  5. CSS 利用transform达到居中效果

    <body> <div class="center"> .... </div> </body> 让left和top都是50%,这在水 ...

  6. 【Codeforces Round #519 by Botan Investments C】 Smallest Word

    [链接] 我是链接,点我呀:) [题意] [题解] 模拟了一两下.. 然后发现. 对于每一个前缀. 组成的新的最小字典序的字符串 要么是s[i]+reverse(前i-1个字符经过操作形成的最大字典序 ...

  7. 洛谷 P2483 BZOJ 1975 [SDOI2010]魔法猪学院

    题目描述 iPig在假期来到了传说中的魔法猪学院,开始为期两个月的魔法猪训练.经过了一周理论知识和一周基本魔法的学习之后,iPig对猪世界的世界本原有了很多的了解:众所周知,世界是由元素构成的:元素与 ...

  8. 0823关于整理MySQL死锁

    -- 更多的是需要理解 http://hedengcheng.com/?p=577 -- 何登成 关于WHERE的提取http://www.cnblogs.com/metoy/p/5545580.ht ...

  9. 0214常用的SQL语句

    1MYSQL自己认为 \n 就是 换行. 如果想表达 \n 则用户必须以 \\n的方式来说明 SELECT CONCAT('"C:\\Program Files\\MySQL\\MySQL ...

  10. [bzoj1452][JSOI2009]Count_树状数组

    Count bzoj-1452 JSOI-2009 题目大意:请维护一个平面内的数据结构,支持:单点修改,查询矩形内给定权值出现次数. 注释:$1\le n,m\le 300$,$1\le Q \le ...