div 移動小示例

原创于 2013-04-25 13:15:38 发布

· 302 阅读

版权

<!DOCTYPE HTML>
<html>
<head>
	<script text="text/javascript">
		window.οnlοad=init;
		
		function init(){
			//alert("bbb");
			var movebtn=document.getElementById("movebtn");
			movebtn.οnclick=move;
		}
		
		function move(){
			var moveObject=document.getElementById("moveObject");
			var bottom=moveObject.style.bottom;
			//alert(parseInt(bottom));
			var bottomNext=parseInt(bottom)+10;
			moveObject.style.bottom=bottomNext+"px";
		}
	</script>
</head>
<body>

<div style="position:absolute; top:50px;left:50px; width:100px; height:100px;background-color:black;">
 
 </div>
 
 <div style="position:absolute; top:60px;left:60px; width:100px; height:100px; 
 
 background-color:Blue;z-index:1;">
 
 </div>
 
 <div id="moveObject" style="position:absolute;bottom:0px; background-color:Silver;width:100px;height:100px;">
 
 </div>
 
 <input id="movebtn" type="button" value="move"/>
 </body>
</html>

div 移動小示例