HTML5 Webové stránky Showcase 48 Potenciální Flash-Killing Demos

Takže jste slyšeli všechny zvěsti o HTML5 by převzali Adobe Flash. Zatímco většina webových komunit argumentuje, že je to možné, nebo ne, musíte se potulovat, co dělá HTML5 tak mocným, že ho chce použít i obří společnost Apple, která nahradí Flash.

To je důvod, proč tento příspěvek existuje, nebudeme mluvit o tom, co může HTML5 dělat, ale ukázat živé ukázky magických věcí, které může HTML5 dosáhnout s jiným jazykem, jako je JavaScript, takže se připravte na inspiraci.

Poznámka: Vzhledem k tomu, že některý webový prohlížeč, jako je například Internet Explorer, není plně podporován HTML5, doporučujeme použít prohlížeč Firefox pro zobrazení všech ukázek HTML5 níže..

Animace

Element HTML5 pro plátno je rozhodujícím faktorem pro HTML5, který nahrazuje určitou animaci Flash. To vám umožní vytvářet dynamické, skriptovatelné vykreslování 2D tvarů a bitmapových obrazů pomocí Javascriptu, což je ostatně řízená animace.

Audioburst animace

Pohodlná a fantastická animace vytvořená s HTML5 plátnem a audio tagem.

Ball Pool

Tato ukázka, která se zobrazuje v poslední události Google I / O, vám ukáže, jak dynamický může být HTML5.

Blob Sallad

HTML5-plodil stvoření, které by vás potěšilo.

Bomomo

S Bomomem můžete pozorovat různé atomové pohyby simulované pomocí HTML5.

Prohlížeč Ball

Vychutnejte si tuto „cross-browser“ HTML5 kouli.

Bubliny

Bavte se vytvořením nekonečných plovoucích bublin s jinou barvou.

Plátno kreslený animace

Jednoduchá a vtipná karikatura HTML5, která vám pomůže pochopit, co může prvek HTML5 vytvořit.

Coolclock

Pěkné, přizpůsobitelné analogové hodiny postavené pomocí HTML5 a JavaScriptu.

Prezentace Flickr PS3

Prohlédněte si fotografie Flickr s prezentací ve stylu PS3 ve webovém prohlížeči.

Interaktivní Polaroid

Interaktivní demo, které funguje velmi podobně jako multi dotykové rozhraní.

JS Ohňostroj

Vychutnejte si ohňostroj s upřednostňovanou gravitací a rychlostí, poháněnou HTML5 a Javascriptem.

Kaleidoskop

Velmi krásný a futuristický HTML5 kaleidoskop.

Kapalné částice

Citlivá animace částic, která reaguje na pohyb myši.

Mesmerizér

Další citlivé a vynikající HTML5 demo, které ukazuje, jak blízké prvky reagují s pohybem myši.

Mlhovina mrak

Ztratit se s touto úžasnou mlhovinou HTML5.

Parallax

Zobrazit všechny 2D tvary v paralelním pohledu.

Animace částic

Elegantní HTML5 částice animace, která může tvořit do vaší preferované zprávy.

Rozpětí

Ztratit s touto nekonečnou šíření animace.

Hvězdné pole

Velmi cool HTML5 hvězdné animace, která by změnila směr a rychlost na základě pohybu myši.

Video zničení

Jedním kliknutím se spustí video.

Průběh

Sledujte, jak se vlnovka HTML5 posouvá změnou její amplitudy, vlnové délky, šířky atd.

3D efekt

Dojem animace na plátně? To je více HTML5 canvas element může udělat, a to se nazývá 3D efekt. Vývojář se může spolehnout na prvek plátna, DOM a JavaScript, aby vytvořil 3D efekt, který lze později rozvinout do 3D animace nebo hry.

Canvas3D a Flickr

Získejte zcela nový 3D zážitek s fotoproudem Flickr.

Simulace oděvů

Realistická simulace textilu na bázi HTML5.

Vyvíjející se monstrum

Sledujte monstrum, které se vyvíjí v komplikované stvoření, jedním z jeho tvůrců je HTML5.

Dárková krabice Google

Obří vyhledávač Google je prezentován ve 3D, hratelném zobrazení.

JS Dotkněte se

Vysoce kvalitní a realistické „3D na 2D plátně“.

Prezentace dat

Zatímco element HTML5 může být použit k vytvoření animace a 3D efektu, může být také implementován pro prezentaci matematických dat.

Gnuplot

Gnuplot, aplikace pro vykreslování dat ve verzi HTML5.

RGraph

RGraph poskytuje širokou škálu prezentací dat, jako je sloupcový graf, indikátor průběhu a tradiční radarový graf.

Webová aplikace

Nakonec, s využitím všech možností v kombinaci s HTML5 a dalšími langauge, je možné vytvořit interaktivní aplikaci nebo hru, která se blíží aplikaci Flash.

CanvasPaint

Svědek, že bratr Microsoft Paint přichází do vašeho webového prohlížeče, a jeho otec je HTML5.

CanvasMol

Vědecká aplikace, která vám pomůže pochopit strukturu určitého prvku Země.

Kreslený Builder

Nakreslete zajímavý kreslený obrázek s tímto minimálním a interaktivním kresleným tvůrcem.

Přetáhněte cokoliv

Přetáhněte cokoliv, co můžete v demo přetáhnout, abyste zobrazili podrobnosti.

Gartic Sketch

Původní HTML5 aplikace, která vám umožní vytvořit některé základní kresby, které lze uložit do jiného formátu obrazu jako jpeg nebo png.

PhysicSketch

Nakreslete, co chcete a uvidíte, jak reagují se simulovanou gravitací.

Skicák

Výkonný HTML5 kreslení aplikace, která vám umožní kreslit a upravovat obraz přesně.

Pokec

Webová aplikace, která potvrzuje geografickou polohu zprávy o počasí, která byla získána ze služby Twitter, a vytvořila tak mapu „sociálního počasí“ na plátně, která je zcela triviální (jak uvádí autor), ale zajímavá.

Hra

3Bored

Nikdy se nebudete nudit, pokud se v příští sekundě můžete vyhnout stovkám střel HTML5.

Vypuknout

Odskočit míč rozbít všechny cihly.

Canvascape

Ne tak docela hru, ale ukazuje, jak HTML5 může být použit k vývoji hry First Person Shooting.

Chytit to

Kolik míčů se můžete vyhnout, abyste získali svůj vítězný čtverec HTML5?

Řetězová reakce

Řetěz výbuchu k dosažení cíle, nenechte se závislý.

Cubeout

Přehrát Tetris ve 3D, pohled shora dolů.

etchaFyzika

Nakreslete položku pro přesunutí míče do hvězdy, nezapomeňte na gravitaci.

Skládačka

Kliknutím, otočením a přetažením dílků vyřešíte tuto hádanku založenou na HTML5.

Snímek Puzzle

Posuňte se k vítězství, další HTML5 hra, která je postavena vytlačit své mysli šťávy.

Stejná hra

Vyjměte určitou skupinu, abyste dostali jinou skupinu ve stejné barvě a vy jste nakonec získali vítězství.

Tetris

Jedna z nejklasičtějších her se vrátila do života HTML5.

Torus

Ještě jedna hra Tetris v pseudo-3D verzi.

Závěr

Jaké je omezení HTML5? V tuto chvíli se nemůžeme rozhodnout, ale s působivým videem níže můžeme zjistit, jak daleko byl HTML5 posunut:

Ano, je to Quake II ve webovém prohlížeči, takže je nyní jasné, že s HTML5 se zrodí více průlomových webových aplikací, které budou sloužit miliardám uživatelů internetu. Je to rychlé, vyvíjející se a mění světový web. Otázkou je, jak byste použili tuto hru měnící HTML5?

Rádi uslyšíme váš nápad!