闲来无事，写了段js仿google首页动画，附源码下载
- Jerry - 博客园-首页原创精华区打开google，发现logo又有新玩意了，又是动画，简单看了一下，还是原来的老样子，将图片一部分一部分的显示出来做成动画效果，粗略估计了一下，功能应该挺简单的，隔了好久没手写js了，手痒痒，于是准备动手写几行代码看看. 谁知，一写又是一大串，不扯那么多，效果图如下：. 1.可以自动根据动画容器的尺寸来将图片分割成不同帧.
闲来无事，写了段js仿google首页动画，附源码下载
标签：
js
google
首页
| 发表时间：2011-10-12 03:41 | 作者：狼Robot Jerry
出处：http://www.cnblogs.com/
打开google，发现logo又有新玩意了，又是动画，简单看了一下，还是原来的老样子，将图片一部分一部分的显示出来做成动画效果，粗略估计了一下，功能应该挺简单的，隔了好久没手写js了，手痒痒，于是准备动手写几行代码看看。谁知，一写又是一大串，不扯那么多，效果图如下：
DEMO(点击图片即可):
功能挺简单：
1.可以自动根据动画容器的尺寸来将图片分割成不同帧。
2.理论上支持图片中的帧可多行排列(比如：要播放的动画有30帧，google现在的做法是全部放在1行，理论上这里可以放成3行，每行10帧)。
3.纯手写,没有引用其它js框架辅助.
没去分析google的js，不知道他们的图片是怎么弄的，下载到的图片前段部分有空白，所以用ps小小处理了一下。
只是模仿了动画部分，一些细节没做处理，比如google首页载入后有个动画是自动播放且在没点击前是重复播放的。
另外还有个缺点，依赖播放容器的background属性，代码写得太长了，就没多大兴趣了，没去研究怎么改进，有兴趣的同学可以处理一下。
代码写得比较乱，有简单注释，大家凑合着看看。代码可无限制使用，但出了问题自己负责修复，当然，有空的话也不妨把改进后的版本发给我。
作者: 狼Robot 发表于 2011-10-12 03:41 原文链接
最新新闻：
· RSA谴责某个国家对它发动网络攻击(2011-10-12 13:44)
· 苹果iMessage或威胁移动运营商短信业务(2011-10-12 13:42)
· iPhone 4S性能测试出炉，表现技压群雄(2011-10-12 13:34)
· 独特，而且有价值的(2011-10-12 13:30)
· 我的上司乔布斯教给我的8堂管理课(2011-10-12 13:21)
相关 [js google 首页] 推荐：
Google 推出 JavaScript 测试工具 Google JS Test
- Tim - ITeye资讯频道Google JS Test是一个运行于V8 JavaScript引擎下的JavaScript单元测试框架，其在Google内部负责对Chrome的快速JS执行速度进行测试，现在Google以开源工程开放给大家使用. Google JS Test主要特性：. 超快的启动速度和执行时间，不需要在浏览器里运行.
Google 推出 Javascript 测试工具 Goole JS Test
- ĐƋɳƞѵїχ - 谷奥——探寻谷歌的奥秘Google JS Test是一个运行于V8 JavaScript引擎下的Javascript单元测试框架，其在Google内部负责对Chrome的快速JS执行速度进行测试，现在Google以开源工程开放大家使用. Google JS Test主要特性：. 超快的启动速度和执行时间，不需要在浏览器里运行.
Google 首页悼念 Steve Jobs 逝世
- Yousri - 谷奥——探寻谷歌的奥秘今天全球所有地区的Google主页都挂上了 “Steve Jobs, 1955 - 2011” 以悼念Steve Jobs的辞世. Steve Jobs并未链接至Google搜索结果，而是apple.com主页. 史蒂芬·保罗·乔布斯（英语：Steven Paul Jobs，1955年2月24日－2011年10月5日），简称为史蒂夫·乔布斯（英语：Steve Jobs），是苹果公司的现任董事会主席，前任首席运行官及创办人之一，同时也是前皮克斯动画工作室的董事长及首席执行官（皮克斯动画工作室已于2006年被迪士尼收购[2]）.
谷奥: Google 在首页强推 Google+ Hangouts 演出视频直播
- lili - 谷奥聚合——谷奥主站+谷安 aggregator尽管这并非黑眼豆豆的Will I. Am第一次利用Google+的Hangouts进行视频群聊了，但却是他第一次出现在Google首页里，这也是Google第一次将一个Google Profile个人链接地址放置在Google首页强推──这可是一个无价的广告位啊. 在直播开始之前的现在，如果你点击那个链接，只能看到黑眼豆豆的Will I.
WebView JS 交互
- - ITeye博客WebView加jquery做页面会怎么样呢. // 创建WebView对象. // 把programList添加到js的全局对象window中，. // 这样就可以使用window.programList来获取数据. * 定义js回调java函数. // 绑定键盘的向上,向下按钮事件触发相应的js事件.
Google在首页以非常显眼的蓝色箭头推广Google+
- cpy - 36氪现在打开Google.com英文主页，你会看到如上图所示，一个大大的蓝色箭头指向页面左上角的+You. 是Google在首页推广刚刚面向所有用户开放注册的Google+. 同时在搜索框的底部也有一个广告. 点击左上角的+You，会跳到Google+的注册界面，如果你还没有注册的话，但是国内用户点击通常是跳到一个连接被重置界面.
JS游戏引擎
- 米随随 - HTML5研究小组If you don’t have anything better to do and want to help fellow redditors interested in JS game dev out, feel free to fork the list and modify it as you like.
來源請求.js
- 红烧鲤鱼 - Blog: timdream很早以前就想講了，但講了大概又會被戰. 相較於英文維基百科，中文維基百科在社會和歷史條目充滿了 systemic bias. 但是那些主觀論述又不是編輯者有意加進去的，而是某種編輯者存在的社會所給予的暗示(Inception?)與集體共識，而不是原本百科全書應該有的可驗證的事實. 因為是暗示又是共識，所以有自覺的百科編輯者反而是少數；中文維基只好長成現在這個樣子了.
Js删除节点
- - JavaScript - Web前端 - ITeye博客 方式一：传this参数调用方法：. 方式二：js方法中通过选择器获取节点：. //此处删除的是a节点
}. 方式三：通过jQuery方式获取节点：（尚未测试，有待测试. 此处a标签传this到js中，js通过this（即a节点）取parent（即p节点）. （1）p.remove();可直接删除整个p节点.