固定标签(position: fixed)
document.body.scrollTop 要改成 document.documentElement.scrollTop不然不生效
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div onclick="GoTop();" style="width: 50px;height: 50px;background-color: black;color: white;
position: fixed;
bottom:20px;
right: 20px;
">返回顶部</div>
<div style="height: 5000px;background-color: #dddddd;">
正文
</div>
<script>
function GoTop(){
document.body.scrollTop = 0;
}
</script>
</body>
</html>
固定标签(position: fixed)的更多相关文章
- 层模型--固定定位(position:fixed)
fixed:表示固定定位,与absolute定位类型类似,但它的相对移动的坐标是视图(屏幕内的网页窗口)本身. 由于视图本身是固定的,它不会随浏览器窗口的滚动条滚动而变化,除非你在屏幕中移动浏览器窗口 ...
- 解决IE不支持position:fixed问题
#box { /* 非IE6浏览器使用固定元素 */ position:fixed; top:0; left:0; /* IE6改为绝对定位,并通过css表达式根据滚动位置更改top的值 */ _po ...
- IE6下position:fixed不支持问题及其解决方式
IE6有诸多奇葩,不支持position:fixed就是当中之中的一个.所以在做一些比方固定在顶部或者底部或者固定元素的效果时须要考虑兼容IE6的这个问题.解决方式是用Ie6的hack. *html ...
- 小技巧css解决移动端ios不兼容position:fixed属性,无需插件
移动端开发仿app头部底部固定设置position:fixed,android2.2以上已经实现.但是在ios8以下系统,当小键盘激活时,都会出现位置浮动问题.如图: 如何解决: 查阅资料之后想到一下 ...
- 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动
一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...
- 解决IE6下固定定位问题 使用position:fixed
IE6浏览器有太多的bug让制作网页的人头疼.这篇文章介绍的是介绍的是如何解决IE6不支持position:fixed;属性的办法. 如果我们需要做某个元素始终位于浏览器的底部,不会因为浏览器窗口的缩 ...
- 解决IE6浏览器下position:fixed固定定位问题
像你所遇到的问题一样, IE6浏览器有太多的bug让制作网页的人头疼.这篇文章介绍的是介绍的是如何解决IE6不支持position:fixed;属性的办法.如果我们需要做某个元素始终位于浏览器的底部, ...
- 浮动层固定兼容IE6 position:fixed的最佳解决方案
第一种:css方法 有时候当我们需要把一个元素固定在页面的某个部位,一般都是用css中的“position:fixed;”方法来解决,但是IE6不支持fixed,所以今天分享一个兼容IE6的页面底部固 ...
- 【微信小程序】view顶部固定或底部固定 + scroll-view中的元素view也可以使用position:fixed;固定选中元素位置
1.顶端固定核心代码如下: <view class="page__hd" style="position:fixed; top:0;width: 750rpx;&q ...
随机推荐
- Spring Boot文件上传
一.创建一个简单的包含WEB依赖的SpringBoot项目 二.配置文件上传的文件大小限制 # 上传文件总的最大值spring.servlet.multipart.max-request-size=1 ...
- Django模板自定义标签和过滤器,模板继承(extend),Django的模型层
上回精彩回顾 视图函数: request对象 request.path 请求路径 request.GET GET请求数据 QueryDict {} request.POST POST请求数据 Quer ...
- mysql NOT NULL约束 语法
mysql NOT NULL约束 语法 作用:约束强制列不接受 NULL 值. 东莞大理石平台 说明:NOT NULL 约束强制字段始终包含值.这意味着,如果不向字段添加值,就无法插入新记录或者更新记 ...
- spring学习笔记之---IOC和DI
IOC和DI (一)IOC (1) 概念 IOC (Inverse of Control) 反转控制,就是将原本在程序中手动创建对象的控制权,交给spring框架管理.简单的说,就是创建对象控制权被反 ...
- Count on a tree(树上路径第K小)
题目链接:https://www.spoj.com/problems/COT/en/ 题意:求树上A,B两点路径上第K小的数 思路:主席树实际上是维护的一个前缀和,而前缀和不一定要出现在一个线性表上. ...
- [CSP-S模拟测试]:星际旅行(欧拉路)
题目传送门(内部题4) 输入格式 第一行两个整数$n,m$,表示行星和虫洞的数量.接下来$m$行,每行两个整数$u,v$,表示存在一个双向虫洞直接连接$u$和$v$.每一个虫洞最多会被描述一次. 输出 ...
- Linux命令行下常用svn命令
1.Linux命令行下将文件checkout到本地目录 svn checkout path(path是服务器上的目录) 例如:svn checkout svn://192.168.1.1/pro/do ...
- java中 使用输入+输出流对对象序列化
对象: 注意记得实现 Serializable package com.nf147.sim.entity; import java.io.Serializable; public class News ...
- ORACLE Physical Standby DG 之fail over
SQL> select thread#, low_sequence#, high_sequence# from v$archive_gap;确认下是否存在日志间隙,发现gap现象,说明failo ...
- python 调用C++ DLL,传递int,char,char*,数组和多维数组
ctypes 数据类型和 C数据类型 对照表 ctypes type C type Python type c_bool _Bool bool (1) c_char char 1-character ...