zoukankan      html  css  js  c++  java
  • cookie记录横向滚动条位置

    一、Css 

    <style type="text/css">
    		#x{
    			 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{
    			 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

     

  • 相关阅读:
    hadoop目录命令
    spark简单文件配置
    git简单使用
    1
    环境
    spring boot入门学习---热部署
    浅谈-对modbus的理解
    springboot集成调用Azkaban
    搭建自己的maven私服 必过
    Spring Boot 出现 in a frame because it set 'X-Frame-Options' to 'DENY'
  • 原文地址:https://www.cnblogs.com/qing1304197382/p/10383738.html
Copyright © 2011-2022 走看看