HTML5 Website Showcase 48 Potentiella Flash-Killing Demos
Så du har hört alla rykten om HTML5 skulle ta över Adobe Flash. Medan de flesta webbsamhället argumenterar för att det är möjligt eller inte, måste du vandra vad som gör HTML5 så kraftfull att även jätteföretaget Apple vill använda det för att ersätta Flash.
Därför finns det här inlägget, vi kommer inte att prata om vad HTML5 kan göra, men visa live demos av magiska saker som HTML5 kan uppnå med andra språk som JavaScript, så gör dig redo att bli inspirerad.
Obs! Eftersom HTML5 inte stöds av en viss webbläsare som Internet Explorer rekommenderar du starkt att du använder Firefox-webbläsaren för att se alla HTML5-demos nedan.
Animering
HTML5s dukelement är den avgörande faktorn för HTML5 för att ersätta vissa Flash-animeringar. Det låter dig bygga dynamisk, skriptbar återgivning av 2D-former och bitmappsbilder med Javascript, vilket med andra medel är kontrollerbar animering.
Audioburst Animation
En bekväm och fantastisk animation skapad med HTML5s duk och ljudtagg.
Bollhav
Visas i den senaste Google I / O-händelsen, den här demonstrationen visar hur dynamiskt kan HTML5 vara.
Blob Sallad
En HTML5-skapad varelse som skulle glädja dig.
Bomomo
Med Bomomo kan du observera olika atombevakning simulerad med HTML5.
Webbläsare
Bli förvånad över den här "cross-browser" HTML5-bollen.
Bubbles
Ha det roligt genom att skapa oändliga flytande bubblor med olika färger.
Canvas Cartoon Animation
En enkel och rolig HTML5-tecknad som hjälper dig att förstå vad HTML5s dukelement kan göra.
Coolclock
En trevlig anpassningsbar analog klocka byggd av HTML5 och JavaScript.
Flickr PS3 Slideshow
Visa dina Flickrs foton med bildspelet i PS3-stil i webbläsaren.
Interaktiv Polaroid
En interaktiv demo som fungerar ungefär som multi-touch-gränssnitt.
JS Fireworks
Njut av fyrverkerimomentet med din föredragna gravitation och hastighet, som drivs av HTML5 och Javascript.
Kalejdoskop
Ett mycket vackert och futuristiskt HTML5 kalejdoskop.
Flytande partiklar
Känslig partikelanimering som reagerar utifrån din musrörelse.
Mesmerizer
En annan känslig och enastående HTML5-demo som visar hur närliggande element reagerar med din musrörelse.
Nebula Cloud
Gå vilse med den här underbara HTML5-nebeln.
Parallax
Visa alla 2D-former i parallellt perspektiv.
Partikel Animation
En elegant HTML5 partikelanimering som kan formas till ditt favoritmeddelande.
Spridning
Gå vilse med denna oändliga spridningsanimation.
Starfield field~~POS=HEADCOMP
En väldigt cool HTML5 starfield animation som skulle ändra riktning och hastighet baserat på din musrörelse.
Video förstöring
Ett klick för att boom en spelfilm.
vågform
Observera hur HTML5s dukvåg rör sig genom att ändra dess amplitud, våglängd, bredd, etc..
3D-effekt
Imponerad av kanvas animering? Det är mer HTML5s dukelement kan göra, och det kallas 3D-effekt. Utvecklare kan förlita sig på dukelement, DOM och JavaScript för att skapa 3D-effekt, som senare kan utvecklas till 3D-animering eller -spel.
Canvas3D och Flickr
Få en helt ny 3D-upplevelse med Flickrs fotoström.
Cloth Simulation
En realistisk, HTML5-baserad tygimulering.
Utvecklande Monster
Observera ett monster som utvecklas till en komplicerad varelse, en av dess skapare är HTML5.
Googles presentförpackning
Giant sökmotor Google presenteras i 3D, spelbar vy.
JS Touch
En högkvalitativ och realistisk "3D på 2D Canvas" showcase.
Data Presentation
Medan HTML5s dukelement kan användas för att skapa animering och 3D-effekt, kan den också implementeras för att presentera matematiska data.
gnuplot
Gnuplot, en dataplottningsapplikation i HTML5-versionen.
RGraph
RGraph erbjuder ett brett spektrum av datapresentation som streckdiagram, framstegsbar och traditionell radarplan.
Webbapplikation
I slutändan kan man med hjälp av alla möjligheter kombinerat med HTML5 och annan långauge skapa en interaktiv applikation eller ett spel som ligger nära Flash-applikationen.
CanvasPaint
Vittnet bror till Microsoft Paint kommer in i din webbläsare, och hans far är HTML5.
CanvasMol
En vetenskaplig applikation som är byggd för att hjälpa dig att förstå vissa jordelementets struktur.
Tecknade byggare
Rita intressant tecknad image med denna minsta och interaktiva tecknade byggare.
Dra något här
Dra vad som helst du kan dra i demo för att visa detaljer.
Gartic Sketch
En original HTML5-applikation som låter dig göra några grundläggande ritningar som kan sparas i olika bildformat som jpeg eller png.
PhysicSketch
Rita vad du vill och se hur de reagerar med simulerad tyngdkraft.
skiss
En kraftfull HTML5-ritningsprogram som gör att du kan rita och redigera din bild på ett exakt sätt.
Småprat
En webbapplikation som bekräftar det geografiska läget av väderrelaterat meddelande som erhölls från Twitter, och därigenom bildar dem på en kartongbaserad "socialväder" -karta, är ganska trivial (enligt författaren) men intressant.
Spel
3Bored
Du kommer aldrig att bli uttråkad om du kan fortsätta att undvika hundratals HTML5-kulor nästa sekund.
Bryta ut
Rebound bollen för att bryta alla tegelstenar.
Canvascape
Inte helt ett spel, men det visar hur HTML5 kan användas för att utveckla First Person Shooting-webbläsarspel.
Fånga den
Hur många bollar kan du undvika för att få din vinnande HTML5-kvadrat?
Kedjereaktion
Kedja explosionen för att uppnå målet, bli inte beroende.
Cubeout
Spela Tetris i 3D, uppifrån och ner.
etchaPhysics
Rita objekt för att flytta bollen till stjärnan, glöm inte om tyngdkraften.
Pussel
Klicka, rotera och släpp pusselbitar för att lösa detta HTML5-baserade pussel.
Slide Puzzle
Skjut till segern, ett annat HTML5-spel som är byggt för att klämma i sig.
Samma spel
Ta bort viss grupp för att få en annan grupp i samma färg och så småningom bli tilldelad en seger.
Tetris
Ett av de mest klassiska spelet togs tillbaka till livet av HTML5.
Torus
Ännu ett Tetris-spel i pseudo-3D-versionen.
Slutsats
Vad är begränsningen av HTML5? Vid den här tiden kan vi inte bestämma oss, men med den imponerande videon nedan kan vi veta hur långt HTML5 har skett:
Ja, det är Quake II i webbläsaren, så nu är det mycket tydligt att med HTML5 skulle en mer banbrytande webbapplikation födas för att tjäna miljarder internetanvändare. Det är snabbt, det utvecklas, och det förändras världsomspännande webben. Frågan är hur skulle du använda den här HTML5-omformningen?
Vi gillar att höra din idé!
