艾萨克牛顿 google主页 代码
还有什么能比 google 主页的logo更值得回味呢? 今天的logo是艾萨克牛顿生日, 纪念logo是一个动画, 很有意思: 一个苹果从苹果树上掉下来了, 代码思路很简单: 两个元素: 苹果,苹果树. 然后设置一个定时器, 控制苹果元素的位置.
苹果树的 onload, 格式化如下, 主要作用是控制苹果的位置: 1 苹果树
<img src=/logos/newton10-tree.jpg width=384 height=138 border=0 alt="艾萨克牛顿" title="艾萨克牛顿" id=logo style="margin-top:-1.22em" onload="...(定时器代码, 后详)">
2 苹果
<img id="fall" src="/logos/newton10-apple.png" style="position:relative;right:248px;bottom:46px"/>
3 定时器代码
window.lol&&lol();
setTimeout( function (){
// setTimeOut 首参: function() 匿名函数
var h=0, v=1,
f=document.getElementById('fall'), // 掉落的苹果 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
}}}
// setInterval 二参: 25 毫秒一次动画
,25);
google.rein&&google.rein.push(function(){
clearInterval(i);
h=0;
v=1})}
// setTimeOut 二参: 2000 毫秒
,2000)
Date: 2010-01-04 16:09:07
HTML generated by org-mode 6.30c in emacs 23
