你的位置: iPc 首页 > 全部文章 > 编程技术 > 阅读文章
科学X网    Office    苹果中国    微软中国    VPS

10个让人眼花缭乱的 HTML5 和 JavaScript 特效,Flash情何以堪啊~

01
七月

作为下一代网页语言,HTML5 拥有很多让人期待已久的新特性。如今,很多 Web 开发人员开始使用 HTML5 来制作各种丰富的 Web 应用来代替 Flash。本文向大家展示10个让人眼花缭乱的 HTML5 和 JavaScript 效果,让你体验下一代 Web 技术的魅力!相信你看完这些例子后会对未来的 Web 发展充满无限期待。

Breathing Galaxies

HTML5 和 JavaScript 特效
动态变换颜色和直径,可通过键盘或者鼠标产生新的形状,这个效果很炫很炫!
FlowerPower
HTML5 和 JavaScript 特效
灵感来自大自然的使用,使用花朵作为画刷,以贝兹曲线方式绘图。
Noise Field
HTML5 和 JavaScript 特效
移动鼠标可改变粒子的运动,点击可随机生成不同的粒子效果。
Keylight
HTML5 和 JavaScript 特效
双击生成两个以后的键即可发出声音,移动键的位置可产生不同的声音效果。
Swirling Tentacles
clip_image005
三维脉冲效果,沿着脉冲线有运动的颜色渐变模块。
Blob
clip_image006
拖动水滴有重力效果,双击可以分离,小水滴碰到大水滴会合并。
Rotating Spiral
clip_image007
旋转的螺旋效果,看得有点头晕,单击可以控制开始和停止旋转。
Magnetic 
HTML5 和 JavaScript 特效

 
模拟磁性粒子流效果,非常逼真。
Trail
clip_image009
彩色颗粒跟随鼠标运动效果,带尾巴淡出效果
Graph Layout
clip_image010
一种交互的力向图布局效果。

关于本文
各种回音
  1. 说: 回复他/她

    杀一个花……

    • 说:

      You need a modern browser to view this.囧
      去那里找

  2. 说: 回复他/她

    有些的看不了 为什么

  3. 说: 回复他/她

    真的很pl 我可以做成桌面吗? 求指教

  4. 说: 回复他/她

    靠前.
    不打开感觉好卡..用的是Chorome开发版.

  5. 说: 回复他/她

    求下载

  6. 说: 回复他/她

    IE10预览版很给力

  7. 说: 回复他/她

    CPU占用一下就上去了。。

  8. 说: 回复他/她

    这个。。。在远景看到了

  9. 说: 回复他/她

    最后一个看不到

  10. 说: 回复他/她

    哪个说的 Html5不占CPU?

  11. 说: 回复他/她

    。。。好花

  12. 说: 回复他/她

    话说昨天刚在远景一个个试完

  13. 说: 回复他/她

    试试头像

    • 说:

      你成功了。

  14. 说: 回复他/她

    都不能看~~~

  15. 说: 回复他/她

    IE6的 飘过

    • 说:

      尼玛。。。神马电脑还装IE6

    • 说:

      你光荣了吧.你自豪了吧

  16. 说: 回复他/她

    科技进步的不少啊,想当年能玩FLASH游戏就觉得很幸福了~~~

  17. 说: 回复他/她

    图片好炫哦!就是看不到flash!

  18. 说: 回复他/她

    cpu下不来

  19. 说: 回复他/她

    情何以堪个锤子。没在flash上看到这些东西,是因为做flash的不稀罕弄这些小儿科。用flash.graphy类,做这些轻而易举。

    • 说:

      你就是个SX,FLASH需要额外控件支持才行,html5直接跑起来,你真尼玛的2

  20. 说: 回复他/她

    卡是因为有几个页面要连接到tweet,这个tweet其实是一个不存在的网站,所以比较慢。

    • 说:

      tweet是不存在的网站……你太狠了……

    • 说:

      在我镇不存在吧……

  21. 说: 回复他/她

    最后一个太牛了。

  22. 说: 回复他/她

    好玩~~~

  23. 说: 回复他/她

    转来转去,把作者都弄错了,哈哈

  24. 说: 回复他/她

    噢,你这里的作者应该是编辑的昵称吧。

  25. 说: 回复他/她

    据说……这是广告

  26. 说: 回复他/她

    刚全部试了下 还真不错

  27. 说: 回复他/她

    其实都是实验性质的. 网站名字一个个不是叫experiment就是test. 是为了实验html的性能而作的.没有任何必要去贬低flash. flash可以用美术的方式和编程的方式来实现这些效果, 更适合应用开发–美术实现上的简便性跟html5 + js相比当然毋庸置疑, 编程上来说也相对简单很多.
    当然就像楼上说的, 需要flash插件支持. 不过这就像html5需要高级的浏览器支持一样. 如果认为浏览器是必需品或者无视它的体积和便捷性还有性能各种乱七八糟的问题的话, 那么flash更不应该存在这些问题了(广泛度-有没有装flash插件的电脑吗?, 体积-2m左右, 性能-至少现在来说,肯定比html5性能好太多…)

    • 说:

      由于flash太占CPU和执行速度太慢 苹果的机子好像不就是全面封杀flash吗,尤其是苹果的便携设备上

    • 说:

      不懂才会说慢的.
      占cpu跟你跑js还是flash没有关系,关键在于你做什么,怎么做. 上面的那些html5特效也很占cpu啊…
      从js和flash的解释性能上来说两者根本达不到用cpu来衡量的级别.

      偷菜用flash来做占那么多cpu, 用html5+js来做更要耗cpu.而且现在的html5+js的性能会比flash更耗cpu.

      便携设备上封杀flash主要是为了封杀视频网站和杜绝flash游戏对app商店的冲击. flash在播放视频时候对电量的消耗确实挺大, 而且flash这技术不在苹果自家手里没有专利权没有去修改优化的能力. 更重要的是会导致flash应用对app商店的冲击,现在网上如此多的flash小游戏, 一旦用户能用flash了, 他/她为啥还要去应用商店买? 所以它会选择更加开放没有专利顾虑而且是作为一门新兴技术的html5, 完全没有市场会被冲击的顾虑.

  28. 说: 回复他/她

    特效很不错,但浏览器要支持html5才行

  29. 说: 回复他/她

    话说10多年前就觉得flash很恶俗 -_-

  30. 说: 回复他/她

    用flash的早就不屑做这些玩意了,有啥好情何以堪….

  31. 说: 回复他/她

    这里面有哪个是Flash搞不出来的?
    说出来,我相信立马就会有一堆更炫的作品出来

微博评论箱