10個令人驚奇的HTML5和JavaScript效果

來源:互聯網
上載者:User

10款令人驚奇的HTML5和javascript效果。回到幾年前,這些效果是根本不可能實現,只能用flash做,但是現在,已經很輕鬆的就可以實現了。(注意:需要ie9,ff4等等支援html5的瀏覽器訪問)

1. Breathing Galaxies

使用鍵盤來改變形狀中的線條樣式,或移動滑鼠來建立一個新的形狀。

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

2. Noise Field

移動滑鼠來改變粒子的運動。點擊隨機產生參數。

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

3. Keylight

根據按鍵放置的位置不同來產生不同的單調。

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

4. Swirling Tentacles

迴圈產生彩色不同顏色的三維線。

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

5. FlowerPower

來自於大自然另一個靈感——使用貝賽爾曲線做為筆刷繪圖工具花朵,使用滑鼠點擊或拖動均可看到效果。

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

6. Blob

一滴可以在螢幕上拋擲的柔軟的水泡,它可以在瀏覽器視窗中彈跳。這個水泡可以分割成許多小水滴(雙擊),如果他們碰撞小水滴們還會合并成一個大水滴。

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

7. Rotating Spiral

獨立旋轉螺旋的效果——簡單,但視覺吸引力。點擊開始,停止和扭轉旋轉。

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

8. Magnetic

磁點是用來控制粒子流。如果有很多粒子圍繞磁鐵,它會輻射的顏色和大小的增加。滑鼠雙擊操作。

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

9. Trail

五顏六色的粒子跟隨滑鼠並在滑鼠周圍旋轉,同時產生一個有機的痕迹,然後慢慢地淡出。

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

Graph Layout

一種互動式力向圖的布局。

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

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.