返回顶部的功能 div固定在页面位置不变

简介:

1.你在网上搜索的时候,可能会搜索到div固定在页面上,不随滚动条滚动而滚动是用CSS写的,写法是position:fixed;bottom:0;

但是这个在iframe满地跑的页面实际开发中,有啥用呢?反正我用了感觉没啥用。

2.还有一种就是JS控制了。我写的是随着滚动滚动 ,计算div的绝对与可视页面的位置不变。

复制代码
$(window.parent).on('scroll',function(){
   $(返回顶部所在div选择器).css('top',parent.document.documentElement.scrollTop+parent.document.body.scrollTop+'px'); 
})//这是在iframe框架中控制父body

$(window).on('scroll',function(){
   $(返回顶部所在div选择器).css('top',document.documentElement.scrollTop+document.body.scrollTop+'px'); 
})//这是在没有iframe框架中控制body
复制代码

3.这里有这两个东西:

parent.document.documentElement.scrollTop//IE 
parent.document.body.scrollTop//谷歌

这是为了考虑兼容性

转载:http://www.cnblogs.com/zqzjs/p/4621040.html

目录
相关文章
|
Web App开发 JavaScript 程序员
如何去掉或者修改网页中的遮罩层,DIV等元素?
起因: 前几天女友在查资料写文章,打开一个网页,发现网页的被一个半透明的遮罩层给覆盖了(一个已经过期的组织活动 的网页,H5就将它遮盖了),就来问我怎么弄。
1568 0
|
7月前
|
Serverless
html 页面中动态计算 div 元素的宽度
html 页面中动态计算 div 元素的宽度
86 2
向上滑动导航固定头部demo效果图示例(整理)
向上滑动导航固定头部demo效果图示例(整理)
|
11月前
form表单,tr循环生成,当超出页面显示时无滚动条
form表单,tr循环生成,当超出页面显示时无滚动条
|
小程序 开发者
小程序__02--navigationBarTitleText配置子页面标题,依旧显示默认标题,子页面配置不显示
navigationBarTitleText配置子页面标题,依旧显示默认标题,子页面配置不显示
|
JavaScript
div内容超出自动滚动
div内容超出自动滚动
368 0
div内容超出自动滚动
|
JSON 前端开发 JavaScript
小记录 单选框的注意点 html中字符串拼接 el-upload手动上传 表格跳转 v-for动态添加背景色 控制label标签于文本框之间的间距
小记录 单选框的注意点 html中字符串拼接 el-upload手动上传 表格跳转 v-for动态添加背景色 控制label标签于文本框之间的间距
【Layui】修改页面的宽
【Layui】修改页面的宽
191 0
【Layui】修改页面的宽
|
前端开发 JavaScript
将div固定在页面最下面、将百度搜索框嵌入页面
版权声明:转载请注明作者及出处,否则将追究法律责任。 https://blog.csdn.net/q2158798/article/details/79310233 1.
1655 0

热门文章

最新文章