js实现div滚动条在页面刷新 滚动条位置固定
思想:1.通过div的onscroll事件记录滚动条的scrollTop值,设置到document.cookie
2.页面加载时再读取document.cookie的值,设置给div的scrollTop
js代码实现:
function KeepScrollBar() {
var scrollPos;
if (typeof window.pageYOffset != 'undefined') {
scrollPos = window.pageYOffset;
}
else if (typeof document.body != 'undefined') {
scrollPos = document.getElementById('divContent').scrollTop;
}
document.cookie = "scrollTop=" + scrollPos; //スクロールバーの位置をcookiesに保存する
}
window.onload = function () {
if (document.cookie.match(/scrollTop=([^;]+)(;|$)/) != null) {
var arr = document.cookie.match(/scrollTop=([^;]+)(;|$)/); //cookiesに値があれば、スクロールバーの位置を読み込み
document.getElementById('divContent').scrollTop = parseInt(arr[1]);
}
}
html代码:
<div id="divContent" style="margin: 7px 0px; clear: both; overflow: scroll; overflow-x: hidden;
text-align: left; width: 1340px; padding: 0px 10px 0px 0px;" onscroll= "KeepScrollBar()">
js实现div滚动条在页面刷新 滚动条位置固定的更多相关文章
- JS控制div跳转到指定的位置的几种解决方案总结
原文:http://www.jb51.net/article/96574.htm 这篇文章主要介绍了JS控制div跳转到指定的位置的几种解决方案总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考 ...
- JavaScript实现页面刷新滚动条位置不变(利用cookie)
实验环境:vs2015 asp.net(C#) 主要原理: 1.在页面滚动时或点击按钮时将当前滚动条位置记录到cookie[pos], 2.页面刷新或重载时查询cookie[pos]中的值是否存在,若 ...
- 功能整合(一):滚动条的变相隐藏、js控制div的渐变显示、滚动条监听
1.滚动条的变相隐藏 思路: 1. 把body的横向,纵向的超出部分隐藏,宽设置100%:高设置100%.就没有body的滚动条了, 2. 然后把最外层的div的宽设置的比body的宽宽一点,把d ...
- JQuery实现页面刷新滚动条自动滚动到特定位置
var cotentOffset = $('#6f').offset(); $('.info_box').animate({ scrollLeft: cotentOffset.left }, ); 原 ...
- JS控制div跳转到指定的位置的解决方案总结
总结一下自己在写这个需求遇到的问题,相信大家应该是经常遇到的.即要求滚轮滚动到指定的位置.先看下基本的解决方案. 1.给链接a加个#的方式来实现跳转.(锚点方法)这里直接贴下代码: html页面: & ...
- JS实现div块的拖放,调换位置
主要是HTML5 的拖放(Drag 和 Drop) 例子(不需要对div设置ID): <!DOCTYPE HTML> <html> <head> <scrip ...
- asp.net页面刷新或者回发后DIV的滚动条位置不变!(转)
源文件:http://www.cnblogs.com/nyth/archive/2011/06/10/2077868.html 当把数据放在div里面,然后给div设置Scroll显示,在页面刷新后或 ...
- JS刷新页面后滚动条的位置不变
有时候,在网页中点击了页面中的按钮或是刷新了页面后,页面滚动条又 会回到顶部,想看后面的记录就又要拖动滚动条,或者要按翻页键,非常不方便,想在提交页面或者在页面刷新的时候仍然保持滚动条的位置不变,最好 ...
- sharepoint 2010 页面刷新时滚动条位置保持不变 Controlling scrollbar position on postback
sharepoint 2010 页面刷新时滚动条位置保持不变 Controlling scrollbar position on postback在sharepoint 2010中,如果当前页面的篇幅 ...
随机推荐
- (转)source、sh、bash、./执行脚本的区别
source.sh.bash../执行脚本的区别 原文:https://www.cnblogs.com/sparkbj/p/5976100.html 1.source命令用法: source Fil ...
- VMware虚拟网卡设置问题
具体操作过程如下: (1)为虚拟机添加虚拟网卡 (2)添加后会自动分配子网ip,不用修改.点击应用,确定. (3)添加完成后本机的网络上会多出一个网络适配器,根据虚拟机器中的ip设置此ip地址, 这里 ...
- 从XCodeGhost事件看软件来源鉴别的重要性
事件 事件引爆于9月18日乌云网公布的一则分析报告:"XCode编译器里有鬼 – XCodeGhost样本分析",这份纯粹的技术分析报告引发中国iOS生态链的众多开发者的关注. 引 ...
- 【Linux相识相知】计算机的组成、linux发行版和哲学思想、基础命令和目录结构(FHS)
从今天开始,Frank将开始在博客上记录自己学习linux的点点滴滴,F初来乍到,还望各位大佬多多指教.本次博客的主要内容如下: 计算机基础:简要的描述了计算机的组成及其功能: linux初识:介绍了 ...
- dojo入门
1.引入dojo.js dojo的发行包里有4个子目录,要引入的文件是名叫"dojo"的子目录里的dojo.js. 假设你是这样的目录结构: project | +--dojo-l ...
- 浅谈C#中HttpWebRequest与HttpWebResponse的使用方法
1.第一招,根据URL地址获取网页信息get方法 public static string GetUrltoHtml(string Url,string type) { try { System.Ne ...
- JS && || 陷阱 javascript 逻辑与、逻辑或 【转】
通常来说逻辑运算a&&b和a||b分别是逻辑与运算和逻辑或运算,返回的是一个布尔值,要么为true,要么为false. 比如在PHP里面a&&b返回类型永远是布尔值,非 ...
- ASP.NET生命周期详解(转)
看到好文章需要分享. 最近一直在学习ASP.NET MVC的生命周期,发现ASP.NET MVC是建立在ASP.NET Framework基础之上的,所以原来对于ASP.NET WebForm中的很多 ...
- (四) HTML之表单元素
HTML中的表单元素,是构成动态网页的重要组成部分,因此,熟知表单元素是十分重要的.下面将根据表单中的一些常用标签进行介绍 1.单选按钮 <input type="radio" ...
- Libxml2 学习
Libxml2 学习 1.概要 libxml 是一个实现操作XML数据功能的开源C语言库. API参考文档 http://xmlsoft.org/html/libxml-tree.html 2.wi ...