10个令人惊奇的HTML5和JavaScript效果

开发 前端
10款令人惊奇的HTML5和javascript效果。回到几年前,这些效果是根本不可能实现,只能用flash做,但是现在,已经很轻松的就可以实现了。

10款令人惊奇的HTML5和javascript效果。回到几年前,这些效果是根本不可能实现,只能用flash做,但是现在,已经很轻松的就可以实现了。

1. Breathing Galaxies

javascrip

使用键盘来改变形状中的线条样式,或移动鼠标来创建一个新的形状。

查看:http://mudcu.be/labs/JS1k/BreathingGalaxies.html

2. Noise Field

HTML5

移动鼠标来改变粒子的运动。点击随机产生参数。

查看:http://www.airtightinteractive.com/demos/processing_js/noisefield08.html

3. Keylight

Keylight

根据按键放置的位置不同来产生不同的单调。

查看:http://hakim.se/experiments/html5/keylight/03/

4. Swirling Tentacles

Swirling Tentacles

循环产生彩色不同颜色的三维线。 

查看:http://acko.net/dumpx/996b.html

5. FlowerPower

FlowerPower

来自于大自然另一个灵感——使用贝赛尔曲线做为笔刷绘图工具花朵,使用鼠标点击或拖动均可看到效果。

查看:http://www.openrise.com/lab/FlowerPower/

6. Blob

Blob

一滴可以在屏幕上抛掷的柔软的水泡,它可以在浏览器窗口中弹跳。这个水泡可以分割成许多小水滴(双击),如果他们碰撞小水滴们还会合并成一个大水滴。

查看:http://hakim.se/experiments/html5/blob/03/

7. Rotating Spiral

Rotating Spiral

独立旋转螺旋的效果——简单,但视觉吸引力。点击开始,停止和扭转旋转。

查看:http://homepage.mac.com/chriswjohnson/automatons/rotating-spiral-1.svg

8. Magnetic

Magnetic

磁点是用来控制粒子流。如果有很多粒子围绕磁铁,它会辐射的颜色和大小的增加。鼠标双击操作。

查看:http://hakim.se/experiments/html5/magnetic/02/

9. Trail

HTML 5

五颜六色的粒子跟随鼠标并在鼠标周围旋转,同时生成一个有机的痕迹,然后慢慢地淡出。

查看:http://hakim.se/experiments/html5/trail/03/

Graph Layout

html 5

一种交互式力向图的布局。

查看:http://canvas-test.appspot.com/

原文链接:http://www.woiweb.net/10-jaw-dropping-html5-and-javascript-effects.html

【编辑推荐】

  1. 20个HTML 5和CSS3的免费网站模板与教程
  2. HTML 5的新标志:你怎么想?
  3. 10个国外开发的HTML 5精彩应用
  4. JavaScript初学者应注意的七个细节
  5. JavaScript内存回收机制深入解读
责任编辑:陈贻新 来源: www.woiweb.net
相关推荐

2011-04-07 11:33:00

HTML 5JavaScript

2013-02-25 10:02:40

HTML5Web

2013-07-24 17:28:02

HTML5预测

2020-10-09 11:02:46

HTML5 特性

2013-07-02 09:17:57

html5组件

2012-09-18 10:07:51

HTML5JSDemo

2013-08-30 10:02:48

2012-11-15 09:59:35

HTML5WebHTML5特效

2011-07-28 13:25:23

Linux

2011-03-18 09:56:19

JavaScript

2015-06-26 11:51:26

HTML5JavaScript

2015-03-05 09:54:28

效果惊艳HTML5应用和源码

2013-02-25 09:16:12

HTML5WebCSS

2011-05-25 09:34:30

HTML5cssjavascript

2014-10-30 10:28:09

HTML5

2011-10-14 09:53:52

HTML 5

2012-09-19 15:21:48

Worklight

2012-04-05 13:19:06

WEBHTML5

2014-04-17 09:54:47

HTML5JavaScript

2009-05-08 13:46:38

JavaScriptHTML5离线存储
点赞
收藏

51CTO技术栈公众号