当前位置: 代码迷 >> Web前端 >> Google苹果跌落效果
  详细解决方案

Google苹果跌落效果

热度:303   发布时间:2012-11-22 00:16:41.0
Google苹果掉落效果
<!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>google纪念牛顿logo</title>
</head>
<body>
<img src="newton09-apple.png" style="visibility: hidden" alt="" />
<a href="" target="_blank">
 <img src="newton09-tree.jpg" width="384" height="138" border="0" 
 alt="艾萨克牛顿" 
 title="艾萨克牛顿" 
 id="logo" 
 style="margin-top: -1.22em" 
 onload="
 setTimeout(function(){
 	var h=0, v=1,
 	f=document.getElementById('fall'),
 	i=setInterval(
 		function(){
 			if(f){
	 			var r=parseInt(f.style.right)+h, b=parseInt(f.style.bottom)-v;
	 			f.style.right=r+'px';
	 			f.style.bottom=b+'px';
	 			if(b>-210){
	 				v+=2
	 			}else{
		 			h=(v>9)?v*0.1:0;
		 			v*=(v>9)?-0.3:0
		 		}
		 	}
	 	},25);
	 }	
 	,2000)"/></a> 
 <img alt="gudao" 
 	id="fall" 
 	src="newton09-apple.png" 
 	style="position: relative; 
 	right: 248px; bottom: 46px" />
 <noscript>
		<style type="text/css">#fall{bottom: -210px !important;}</style>
 </noscript>
</body>
</html>

?

  相关解决方案