首页 > 其他 > 详细

老鹰捉小鸡 鼠标跟随div

时间:2015-09-05 23:43:53      阅读:316      评论:0      收藏:0      [点我收藏+]
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
	    div{width:20px;height:20px;background: red; position:absolute;}
	</style>
	<body style="height:3000px">
	   
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	   <div ></div>
	</body>
</html>
<script>

  function getPos(ev){
  	var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;
  	var scrollLeft = document.documentElement.scrollLeft||document.body.scrollLeft;
  	return {x:ev.clientX+scrollLeft,y:ev.clientY+scrollTop}
  }

	document.onmousemove = function(ev){
		var oEvent = ev||event;
		var pos = getPos(event);
		var oDiv = document.getElementsByTagName("div");
         for(var i=oDiv.length-1;i>0;i--){
         	oDiv[i].style.left = oDiv[i-1].offsetLeft+"px";
         	oDiv[i].style.top = oDiv[i-1].offsetTop+"px";
         }
         oDiv[0].style.left = pos.x+"px";
         oDiv[0].style.top = pos.y+"px";
		
	}
</script>

  

老鹰捉小鸡 鼠标跟随div

原文:http://www.cnblogs.com/dcwq/p/4784117.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!