<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <div onclick="GoTop();" style="position: fixed; background-color: #022531; color: #eff9f9; bottom: 20px; right: 20px; height: 50px; width: 50px;">返回顶部</div>

    <div style="height: 5000px; background-color: #dddddd; color: #f25022">

    </div>

    <script>

        function GoTop(){

            document.body.scrollTop = 0;

        }

    </script>

</body>

</html>

返回顶部 fixed oncheck(点击按钮）的更多相关文章

  1. 弹性返回顶部JS代码

    弹性返回顶部JS代码 弹性返回顶部JS代码点击下载

  2. JS——BOM操作（点击按钮返回顶部案例：scrollTop的用法）

    点击按钮返回顶部案例: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  3. Web前端 页面功能——点击按钮返回顶部的实现方法

    1. 最简单的静态返回顶部,点击直接跳转页面顶部,常见于固定放置在页面底部返回顶部功能 方法一:用命名锚点击返回到顶部预设的id为top的元素 html代码 <a href="#top ...

  4. 在页面中有overflow-y:auto属性的div,当出现滚动条，点击返回顶部按钮，内容回这个div最顶部

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

  5. 渲染优化 之fixed与返回顶部 以及开启GPU Hack

    fixed元素,常见网站右侧出现一个返回顶部的按钮,滚动的时候,会发现返回顶部这个区域在不停的进行重绘,而返回顶部是position:fixed定位的.这也解释了为什么fixed定位是最耗性能的属性之 ...

  6. jquery返回顶部和底部插件和解决ie6下fixed插件

    (function($){ //返回顶部和底部插件 $.fn.extend({ goTopBootom:function (options){ //默认参数 var defaults = { &quo ...

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

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

  8. PC返回顶部浮动按钮

    要添加的css: <style> .up{width:54px;height:54px;background:url(/Images/topback.gif) no-repeat 0 0; ...

  9. 添加“返回顶部”小图标按钮的JS(JavaScript)代码详解

    如何给自己的网站添加方便快捷的"返回顶部"小图标按钮呢?如下图: JS源代码: /** * JavaScript脚本实现回到页面顶部示例 * @param acceleration ...

随机推荐

  1. OracleDesigner学习笔记1――安装篇

    OracleDesigner学习笔记1――安装篇   QQ:King MSN:qiutianwh@msn.com Email:qqking@gmail.com 一．       前言 Oracle是当 ...

  2. sql server 阻塞与锁

    SQL Server阻塞与锁 在讨论阻塞与加锁之前,需要先理解一些核心概念:并发性.事务.隔离级别.阻塞锁及死锁. 并发性是指多个进程在相同时间访问或者更改共享数据的能力.一般情况而言,一个系统在互不 ...

  3. 在 php 7.3 中 switch 语句中使用 continue

    在 php 7.3 中 switch 语句中使用 continue 在 php 7.3 的 switch 中使用 continue 会出现警告.1 2 3 while ($foo) { switch ...

  4. npm 使用

    npm 命令: 命令 作用 npm init 产生package.json文件 npm list <package> 查看安装的module版本 npm update <packag ...

  5. asp.net core 2.0 试用

    1.win7专业版,创建core2.0应用后,运行一直报网关错误,后重装社区版, 安装了asp.net和web开发 数据存储和处理 创建Core2.0应用及打开原2.0应用均正常. 2.win10专业 ...

  6. redux学习与使用

    Redux: 主要概念Action,reducer,store,state 原理:dispatch ({ type:action, preload: { val } } ) --->reduce ...

  7. Cenots7对lvm逻辑卷分区大小的调整

    Cenots7对lvm逻辑卷分区大小的调整 (针对xfs和ext4不同文件系统) 1.支持的文件系统类型 特别注意的是: resize2fs命令            针对的是ext2.ext3.ex ...

  8. 把存储过程SELECT INTO到临时表

    在开发过程中,很多时候要把结果集存放到临时表中,常用的方法有两种. 一. SELECT INTO1. 使用select into会自动生成临时表,不需要事先创建12 select * into #te ...

  9. JSP+JavaBean+Servlet技术（MVC模型）

    一,Servlet开发用户在浏览器中输入一个网址并回车,浏览器会向服务器发送一个HTTP请求.服务器端程序接受这个请求,并对请求进行处理,然后发送一个回应.浏览器收到回应,再把回应的内容显示出来.这种 ...

  10. Bluez相关的各种tools的使用

    7.1        Bccmd Bccmd是用来和CSR的芯片进行BCCMD(Bluecore command protocol)通讯的一个工具.BCCMD并非蓝牙协议栈的标准,而是CSR芯片的专属 ...