越来越多的使用html5来做的颗粒运动效果

2011 - 9 - 1 作者 : Jimco 分类 : HTML/CSS

       HTML5 开始由小而变大,快速的野蛮成长起来,并且渐入佳境,它强大的功能正被很多人逐渐挖掘出来,各种实验性应用层出不穷,千奇百怪,本文介绍几个由 老外Hakim El Hattab 设计的 HTML5 趣味颗粒运动小应用例子,它们非常有趣和酷炫,我在它们身上消磨了差不多3个小时。当你体验完这几个小应用,会发现 HTML5 比你想象的强大的多。尼会惊讶原来HTML5也可以这样子。


Sinuous

点击查看原图

在浩瀚的星系间履行,小心装上些红色的星球,绿色的星球可以吃掉,可以增加体能。

开始体验>>


Bakemono

点击查看原图

鼠标在页面空白位置点击,这个小怪物会扑过去。

开始体验>>


Keylight

点击查看原图

我太喜欢这个小程序了,在一个空房间,双击鼠标,会放置上一个小球,当放进两个小球的时候,一道粒子束在两个球之间撞击,并发出悦耳的声音,随着小球的增多,粒子束在每个小球之间穿梭撞击,离你越近的小球,声音越清脆,音调越高,这样就形成了连续的音乐。

开始体验>>


Blob

点击查看原图

一些果冻样的东西,会滑向你鼠标点击的位置,在果冻球体中间点击,会将它扯成两半,它们在到处滑动的时候,还会再溶合到一起。

开始体验>>


Magnetic

点击查看原图

也是我最爱的一个小程序。鼠标在夜空中双击,可以创造一颗恒星,同时创造出十几颗卫星绕着它转,你可以创造很多这样的恒星系,当它们中的某些靠近到一起形成质量比较大的恒星系的时候,可以吸引更多的卫星绕着它们转。

开始体验>>


Trail

点击查看原图

五颜六色的彩带,随着鼠标飘动,鼠标不动的时候,便围着鼠标箭头旋转,非常简单,但很流畅,视觉效果很漂亮。

开始体验>>


Particle Depth

点击查看原图

很 Cool 的三维效果。

开始体验>>


Wave

点击查看原图

水面随着鼠标形成波浪,水面的浮球也随着沉浮,效果非常棒。

开始体验>>


Particles

点击查看原图

粒子在屏幕上飘动,遇到鼠标的时候膨胀。

开始体验>>

 

译者注

       这组 HTML5 实验应用加载速度非常慢,初以为是 HTML5 本身性能的问题,研究过源代码才发现,原来页面上调用了 Twitter 的饰件(http://platform.twitter.com/widgets.js),因为世界上压根没有 Twitter,我们早就知道,但这些网页不知道,所以还傻傻地去连接,浪费了大量的时间。使用 Godaddy的服务器测试,每个页面大约需要 0.2 秒就打开了。有人说,他们代表先进生产力。

6540 人围观 / 21 条评论 ↓快速评论↓

  • 厉害!超级喜欢这些效果~阿狸5

    晴刃 2013-01-25 11:47 回复

  • 喵啦!
    N喜欢。。。
    转了哦!阿狸5阿狸21阿狸21

    大懒猫 2011-10-16 21:53 回复

  • |ali19为什么我总是沉没于海  无影无踪????

    保健品 2011-09-14 11:40 回复

    • @保健品:因为哥瞧出你是贴小广告来的了!

      Jimco 2011-09-15 17:42 回复

  • 本来想玩一下,结果悲哀地发现根本玩不了

    植物 2011-09-14 10:42 回复

    • @植物:囧~哥们儿不会是用IE6玩的吧~~

      Jimco 2011-09-15 17:46 回复

  • 祝福中秋快乐、合家欢乐!

    太子虹 2011-09-12 15:03 回复

    • @太子虹:^_^中秋快乐!

      Jimco 2011-09-12 16:49 回复

  • 很多人不知道是什么东西呢

    mxcad 2011-09-11 23:52 回复

(必须)

(必须,保密)

阿狸1 阿狸2 阿狸3 阿狸4 阿狸5 阿狸6 阿狸7 阿狸8 阿狸9 阿狸10 阿狸11 阿狸12 阿狸13 阿狸14 阿狸15 阿狸16 阿狸17 阿狸18

Powered by Jimco

©2013 前端那些事儿 Designed by Jimco

About me|意见反馈