一、Css

<style type="text/css">
#x{
width: 100%;
white-space: nowrap;
overflow-x: scroll;
overflow-y: hidden;
-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;
-webkit-overflow-scrolling: touch;
text-align: justify;
box-sizing: border-box;
}
#x p{
width: 50px;
display: inline-block;
}
</style>

  

二、div

<div id="x" style="" onscroll="SetW(this)">
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
</div>

  

三、JavaScript   引用jQuery.js<script>

			var _w = 0;
function SetW(o)
{
_w = o.scrollLeft;
SetCookie("a",_w);
console.log(_w)
}
window.onload = function(){ document.getElementById("x").scrollLeft = GetCookie("a");}
function SetCookie(sName, sValue){
document.cookie = sName + "=" + escape(sValue) + "; ";
}
function GetCookie(sName){
var aCookie = document.cookie.split("; ");
console.log(aCookie.length)
for (var i=0; i < aCookie.length; i++) {
var aCrumb=aCookie[i].split("=");
if (sName == aCrumb[0])
return unescape(aCrumb[1]); } return 0;
}
</script>

四、

cookie记录竖向滚动条位置   参考https://blog.csdn.net/lwdl123321/article/details/42522677

 

cookie记录横向滚动条位置的更多相关文章

  1. asp.net页面刷新或者回发后DIV的滚动条位置不变!(转)

    源文件:http://www.cnblogs.com/nyth/archive/2011/06/10/2077868.html 当把数据放在div里面,然后给div设置Scroll显示,在页面刷新后或 ...

  2. 设置fixed,横向滚动条失效

    window.onscroll = function(){ var sl = -Math.max(document.body.scrollLeft,document.documentElement.s ...

  3. WebStorage记录滚动条位置

    因关注公众号<HTML5学堂>看到这篇文章 "利用本地存储,记录滚动条的位置" ,便好奇敲来试试,然后又看了一些关于WebStorage的资料 附上这篇文章的地址 ht ...

  4. JavaScript实现页面刷新滚动条位置不变(利用cookie)

    实验环境:vs2015 asp.net(C#) 主要原理: 1.在页面滚动时或点击按钮时将当前滚动条位置记录到cookie[pos], 2.页面刷新或重载时查询cookie[pos]中的值是否存在,若 ...

  5. JS实现刷新页面后回到记录时滚动条的位置

    window.onbeforeunload = function () { var scrollPos; if (typeof window.pageYOffset != 'undefined') { ...

  6. table 上下左右 4根线的写法 :before :after 他们就能把td里面右下的那颗线给盖上 还有body和header横向滚动的联动 || 不能把body套在header上是为了上header表头固定 || 还有表头header的右侧overflow-y 是否出现滚动条的位置 记得有一个$nextTick 要不然会获取不到高度 高度就为0了 || 横向滚动条纵向滚动条

    table 上下左右 4根线的写法 <!--* @description 重点查核人员表!--><template> <div class="keyChecke ...

  7. JS利用cookie记录当前位置实现刷新页面后还可以保持菜单栏的展开或闭合

    代码如下,重点是JS部分的代码(部分样式引用的是Bootstrapt中的):   <style> .sidebar-menu .special{ font-size: 16px; marg ...

  8. DataGrid横向滚动条无法拖动的问题

    项目中经常遇到一些问题,这些问题可能很简单,但是之前从未遇到,可能经过了一番谷歌,也可能是查阅了MSDN,或是借鉴了大牛博客,逐渐有了些眉目,为了将这些东西落地,也为了将来之不易的东西记录下来,以备今 ...

  9. js设置滚动条位置

    JS控制滚动条的位置: window.scrollTo(x,y); 竖向滚动条置顶(window.scrollTo(0,0); 竖向滚动条置底 window.scrollTo(0,document.b ...

随机推荐

  1. [转帖]""(双引号) 与''(单引号) 差在哪?

    ""(双引号) 与''(单引号) 差在哪? http://wiki.jikexueyuan.com/project/13-questions-of-shell/double-sin ...

  2. mysql原生语句基础知识

    要操作数据库,首先要登录mysql: *mysql -u root -p 密码 创建数据库: *create database Runoob(数据库名); 删除数据库: *drop database ...

  3. Tenka1 Programmer Contest 2019

    C:即要使前一部分为白色后一部分为黑色,枚举分割点前缀和计算答案取min即可. #include<bits/stdc++.h> using namespace std; #define l ...

  4. codeforces960G. Bandit Blues

    题目链接:codeforces960G 来看看三倍经验:hdu4372 luogu4609 某蒟蒻的关于第一类斯特林数的一点理解QAQ:https://www.cnblogs.com/zhou2003 ...

  5. java并发编程 | 锁详解:AQS,Lock,ReentrantLock,ReentrantReadWriteLock

    原文:java并发编程 | 锁详解:AQS,Lock,ReentrantLock,ReentrantReadWriteLock 锁 锁是用来控制多个线程访问共享资源的方式,java中可以使用synch ...

  6. Linux 三剑客(Awk、Sed、Grep)

    grep/egrep 主要作用:给搜索过滤出来的内容加上颜色和排除功能 常用参数 -V 打印grep的版本号 -E 解释PATTERN作为扩展正则表达式,也就相当于使用egrep. 或操作 -F 解释 ...

  7. Xcode10 不能导入头文件(导入头文件不提示)

    连接地址:https://blog.csdn.net/wyz670083956/article/details/87774705 xcode10可能是:Project Settings

  8. halcon+WinForm打开摄像头

    注意引用halcon.dll,项目属性平台一致(X64) using HalconDotNet;//引用halcon using System.Threading;//引用线程 namespace M ...

  9. 什么是Annotation

    Annotation 被称为注解,在Java开发中是相当常见的,通过注解,我们可以简化代码提高开发效率.例如Override Annotation,这个应该算是在开发过程中使用最多的注解了.注解(An ...

  10. Hadoop记录-queue使用率

    #!/bin/sh ip=xxx port=8088 export HADOOP_HOME=/app/hadoop/bin rmstate1=$($HADOOP_HOME/yarn rmadmin - ...