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>
    <title>My JSP 'MyJsp.jsp' starting page</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
	<style type="text/css">
	#box{float:inherit;position:relative;width:295px;}
	.div1{}
	.div2{position:fixed;_position:absolute;top:3px;z-index:295;}
	</style>   
  </head>
  
  <body>
  <h1>google地图</h1>
  <div id="box"> 
    <div id="float" class="div1" style="float: left;">
        <img src="/yd/jsppages/visit/images/accordion.png" alt="天天向上" />
    </div>  
    
     //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>//随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
    
    //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>//随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
        //随滚动移动的部分代码<br/>
  </div>
  <script type="text/javascript">  
		(function(){
		    var oDiv=document.getElementById("float");
		    var H=0,iE6;
		    var Y=oDiv;
		    while(Y){H+=Y.offsetTop;Y=Y.offsetParent};
		    iE6=window.ActiveXObject&&!window.XMLHttpRequest;
		    if(!iE6){
		        window.onscroll=function()
		        {
		            var s=document.body.scrollTop||document.documentElement.scrollTop;
		            if(s>H){oDiv.className="div1 div2";if(iE6){oDiv.style.top=(s-H)+"px";}}
		            else{oDiv.className="div1";}    
		        }; 
		    }
		})(); 
	</script>
  </body>
</html>


原文地址:http://www.williamlong.info/archives/2864.html

欢迎技术交流。 QQ:138986722


posted @ 2011-11-30 15:35  java程序员填空  阅读(125)  评论(0编辑  收藏  举报