码迷,mamicode.com
首页 > 其他好文 > 详细

cookie记录横向滚动条位置

时间:2019-02-15 15:16:54      阅读:197      评论:0      收藏:0      [点我收藏+]

标签:play   net   value   OLE   set   text   highlight   setcookie   spl   

一、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记录横向滚动条位置

标签:play   net   value   OLE   set   text   highlight   setcookie   spl   

原文地址:https://www.cnblogs.com/qing1304197382/p/10383738.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!