zoukankan      html  css  js  c++  java
  • Javascript 保持浮动位置

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    <meta content="zh-cn" http-equiv="Content-Language" />
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>无标题 1</title>
    <style type="text/css">
    body{
    	margin:0;
    	padding:0;
    }
    .middle
    {
    	100%;
    	height:30px;
    	border:1px #ccc solid;
    	background:#f3f3f3;
    	text-align:center;
    	font-size:12px;
    	line-height:30px;
    	position:absolute;
    	top:30px;
    }
    </style>
    </head>
    
    <body>
    <div class="middle" id="floatDiv">一直在中间,从不曾改变</div>
    <script type="text/javascript">
    <!--
    function setVCenter()
    {
    	var obj = document.getElementById("floatDiv");
    	var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
    	var iT = 300 + scrollTop ;
    	obj.style.top = iT + "px";
    	
    }
    setVCenter();
    window.onscroll = function(){
    	setVCenter();
    };
    //-->
    </script>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    <p>1 </p>
    
    </body>
    
    </html>
    

      

  • 相关阅读:
    Scrapy settings 并发数更改
    tp5 规避 [ error ] 未定义数组索引
    967. Numbers With Same Consecutive Differences
    846. Hand of Straights
    1103. Distribute Candies to People
    559. Maximum Depth of N-ary Tree
    1038. Binary Search Tree to Greater Sum Tree
    538. Convert BST to Greater Tree
    541. Reverse String II
    1551. Minimum Operations to Make Array Equal
  • 原文地址:https://www.cnblogs.com/blackice/p/2851062.html
Copyright © 2011-2022 走看看