48 HTML5 / CSS3 demo basati

mihise marrazki bizidunen animazioa HTML5 Erakusleiho: 48 Flash Killing Potentzial Demo

Artikulu honen iruzkinetan duela gutxi egin zenuen galdera bati erantzuteko hartzen dut mezu hau:

Noiz da une egokia HTML5arekin guztiz diseinatzen hasteko?

Beno, egia esan, helburu duzunaren araberakoa da. Zure bisitariek Internet Explorer erabiltzeko asmorik ez baduzu (adibidez: Mac software orria), hasi oraintxe bertan HTML5-rekin, baina IE duten pertsonak zure webgunea ikusteko behar baduzu, hobe duzu itxaron ...

Sarreran, salto egin ondoren, harrigarriak diren eta ikustea merezi duten 48 HTML5 demo. Handia gutxi da.

Iturria | HongKiat

audioburst Animazioa

Animazio eroso eta zoragarria, HTML5en mihise eta audio etiketekin sortua.

audioburst animazioa HTML5 Showcase: 48 Flash Killing Demo potentzialak

Pilota igerilekua

Google I / O azken gertaeran erakusten ari den honetan, demo honek HTML5 zein dinamikoa izan daitekeen erakusten dizu.

pilota igerilekua HTML5 erakusleihoa: 48 Flash Killing Demo potentzialak

Blob Salad

HTML5 sortutako izakia gustatuko litzaizuke.

blob sallad HTML5 Showcase: 48 Flash Killing Potentzial Demo

bomomo

Bomomorekin HTML5 bidez simulatutako mugimendu atomiko desberdinak behatu ditzakezu.

bomomo HTML5 Showcase: 48 Flash Killing Potentzial Demo

Browser Ball

Harritu zaitez HTML5 "arakatzaile gurutzatu" honekin.

arakatzailearen bola HTML5 erakusleihoa: 48 Flash Killing Demo potentzialak

Bubbles

Ondo pasa kolore desberdineko burbuila mugikor amaigabeak sortuz.

burbuilak HTML5 Erakusleihoan: 48 Flash Killing Potentzial Demo

Mihise marrazki bizidunen animazioa

HTML5 marrazki bizidun HTML5 marrazki bizidun sinple eta dibertigarria.

mihise marrazki bizidunen animazioa HTML5 Erakusleiho: 48 Flash Killing Potentzial Demo

coolerlojua

Erloju analogiko polita eta pertsonalizagarria HTML5 eta JavaScript-ek sortua.

coolclock HTML5 Showcase: 48 Flash Killing Potentzial Demo

Flickr PS3 Aurkezpena

Ikusi zure Flickr-en argazkiak PS3 estiloko diaporama erabiliz web arakatzailean.

flickr ps3 diapositiba aurkezpena HTML5 Erakusleihoa: 48 Flash Killing Demo Potential

Polaroid interaktiboa

Ukipen anitzeko interfazearen antzekoa den demo interaktiboa.

interaktibo polaroid HTML5 erakusleihoa: 48 Flash Killing Potentzial Demo

JS Su artifizialak

Gozatu su artifizialen unea zure grabitate eta abiadura hobeekin, HTML5 eta Javascript-ek bultzatuta.

js fireworks HTML5 Showcase: 48 Flash Killing Demos potentzialak

Caleidoscopio

HTML5 kaleidoskopio oso zoragarria eta futurista.

kaleidoskopioa HTML5 Erakusleiho: 48 Flash Killing Potentzial Demo

Partikula likidoak

Zure saguaren mugimenduan oinarrituta erreakzionatzen duen partikula sentikorren animazioa.

partikula likidoak HTML5 Erakusleihoan: 48 Flash Killing Potentzial Demo

Hipnotizatzailea

Inguruko elementuek zure saguaren mugimenduarekin nola erreakzionatzen duten erakusten duen HTML5 demo sentikor eta bikaina.

mesmerizer HTML5 Showcase: 48 Flash Killing Potentzial Demo

Nebulosa Hodeia

Galdu HTML5 nebulosa zoragarri honekin.

nebulosa hodeia HTML5 erakusleiho: 48 Flash Killing Potentzial Demo

Parallax

Ikusi 2D forma guztiak ikuspegi paraleloan.

parallax HTML5 Showcase: 48 Flash Killing Demo potentzialak

Partikulen Animazioa

HTML5 partikula animazio dotorea, zure gustuko mezuan sor daitekeena.

partikulen animazioa HTML5 erakusleihoa: 48 Flash Killing Demo potentzialak

Zabaldu

Galdu zaitez zabaldutako animazio amaigabe honekin.

zabaldu HTML5 erakusleihoa: 48 Flash Killing Potentzial Demo

Starfield

Zure saguaren mugimenduaren arabera norabidea eta abiadura aldatuko lukeen HTML5 izar-zelaiaren animazio oso polita.

starfield HTML5 Showcase: 48 Flash Killing Potentzial Demo

Bideo suntsipena

Klik bat erreproduzitzen ari den bideoa goratzeko.

bideo suntsiketa HTML5 Erakusleihoan: 48 Flash Killing Potentzial Demo

uhin

Ohartu HTML5aren mihise uhina nola mugitzen den bere anplitudea, uhin luzera, zabalera etab aldatuz.

uhin forma HTML5 erakusleihoa: 48 Flash Killing Potentzial Demo

3D efektua

Mihise animazioak harrituta? Hori gehiago egin dezake HTML5en mihisearen elementuak, eta 3D efektua deitzen zaio. Garatzaileak mihisearen elementua, DOM eta JavaScript erabil ditzake 3D efektua sortzeko, gerora 3D animazio edo joko bihurtzeko.

Canvas3D eta Flickr

Izan ezazu 3D esperientzia berria Flickr-en photostream-ekin.

canvas3d eta flickr HTML5 Showcase: 48 Flash Killing Potentzial Demo

Oihalezko simulazioa

HTML5ean oinarritutako oihal simulazio errealista.

oihalaren simulazioa HTML5 Erakusleiho: 48 Flash Killing Potentzial Demo

Munstro ebolutiboa

Ikusi izaki korapilatsu bihurtzen ari den munstro bat, bere sortzaileetako bat HTML5 da.

munstro ebolutiboa HTML5 erakusleihoa: 48 Flash Killing Demos potentzialak

google opari kutxa

Google bilatzaile erraldoia 3D erreproduzitzeko moduan aurkezten da.

google giftbox HTML5 Showcase: 48 Flash Killing Potentzial Demo

JS Touch

Kalitate handiko eta "3D 2D Mihise gainean" erakusleiho errealista.

js touch HTML5 Showcase: 48 Flash Killing Potentzial Demo

Datuen aurkezpena

HTML5en mihisearen elementua animazioa eta 3D efektua sortzeko erabil daitekeen arren, datu matematikoak aurkezteko ere inplementatu daiteke.

gnuplot

Gnuplot, datuak irudikatzeko aplikazioa HTML5 bertsioan.

gnuplot HTML5 Showcase: 48 Flash Killing Potentzial Demo

RGraph

RGraph-ek datuen aurkezpen ugari eskaintzen ditu barra diagrama, aurrerapen barra eta radar diagrama tradizionala bezalakoak.

rgraph HTML5 Showcase: 48 Flash Killing Potentzial Demo

Web aplikazioa

Azkenean, HTML5ek eta beste hizkuntza batzuek konbinatutako aukera guztiak erabiliz, Flash aplikaziotik hurbil dagoen aplikazio edo joko interaktiboa sor daiteke.

CanvasPaint

Ikusi Microsoft Paint-en anaia zure web arakatzailean sartzen dela eta bere aita HTML5 da.

canvaspaint HTML5 Showcase: 48 Flash Killing Potentzial Demo

CanvasMol

Lurreko zenbait elementuren egitura ulertzen laguntzeko eraikitako aplikazio zientifikoa.

canvasmol HTML5 Showcase: 48 Flash Killing Potentzial Demo

Marrazki bizidunen eraikitzailea

Marraztu marrazki bizidunen irudi interesgarria marrazki bizidunen eraikitzaile minimo eta interaktibo honekin.

marrazki bizidunen eraikitzailea HTML5 Showcase: 48 Flash Killing Potentzial Demo

Arrastatu Edozer Hona

Arrastatu demoan arrastatu dezakezun guztia xehetasunak erakusteko.

arrastatu edozer HTML5 erakusleiho honetara: 48 Flash Killing Potentzial Demo

Gartic zirriborroa

Jpeg edo png bezalako irudi formatu desberdinetan gorde daitezkeen oinarrizko marrazki batzuk egiteko aukera ematen duen HTML5 aplikazio originala.

gartic sketch HTML5 Erakusleihoa: 48 Potential Flash Killing Demos

PhysicSketch

Marraztu nahi duzuna eta ikusi grabitate simulatuarekin nola erreakzionatzen duten.

physicsketch HTML5 Showcase: 48 Flash Killing Potentzial Demo

Sketchpad

Zure irudia modu zehatzean marraztu eta editatzeko aukera ematen duen HTML5 marrazketa aplikazio indartsua.

sketchpad HTML5 Showcase: 48 Flash Killing Potentzial Demo

Eztabaida txikia

Twitter-etik eskuratutako eguraldiarekin lotutako mezuen posizio geografikoa berresten duen web aplikazioa. Horrela, mihisean oinarritutako "eguraldi soziala" mapa osatzen dute, nahiko hutsala (egileak esan bezala) baina interesgarria.

smalltalk HTML5 Showcase: 48 Flash Killing Potentzial Demo

Game

3Aspertuta

Inoiz ez zinateke aspertuko hurrengo segundoan HTML5 ehunka bala saihesten jarraituz gero.

3bored HTML5 Showcase: 48 Flash Killing Potentzial Demo

Breakout

Baloia errebotea adreilu guztiak apurtzeko.

Breakout HTML5 Showcase: 48 Flash Killing Potentzial Demo

Canvascape

Ez da nahiko joko, baina erakusten du HTML5 nola erabil daitekeen First Person Shooting arakatzailearen jokoa garatzeko.

canvascape HTML5 Showcase: 48 Flash Killing Potentzial Demo

Harrapatu

Zenbat pilota saihestu ditzakezu zure HTML5 karratu irabazlea lortzeko?

harrapatu HTML5 Showcase: 48 Flash Killing Potentzial Demo

Chain erreakzioa

Kateatu leherketa helburua lortzeko, ez zaitez mendekatu.

kate erreakzioa HTML5 Erakusleiho: 48 Flash Killing Potentzial Demo

kuboa

Jolastu Tetris 3Dan, goitik beherako ikuspegian.

cubeout HTML5 Showcase: 48 Flash Killing Potentzial Demo

etchaFisika

Marraztu elementua baloia izarrera eramateko, ez ahaztu grabitatearen inguruan.

etchaphysics HTML5 Showcase: 48 Flash Killing Potentzial Demo

Jigsaw Puzzle

Egin klik, biratu eta askatu puzzle piezak HTML5ean oinarritutako puzzle hau konpontzeko.

puzzle puzzle HTML5 erakusleihoa: 48 Flash Killing Potentzial Demo

Diapositiba puzzle

Irristatu garaipenera, zure gogoari zukua ateratzeko eraikitako beste HTML5 joko bat.

slide puzzle HTML5 Showcase: 48 Potential Flash Killing Demo

Joko bera

Kendu talde jakin bat kolore bereko beste talde bat lortzeko eta azkenean garaipena lortuko zenuke.

joko bera HTML5 Showcase: 48 Flash Killing Potentzial Demo

Tetris

HTML5ek biziarazi duen joko klasikoenetako bat.

tetris HTML5 Showcase: 48 Flash Killing Potentzial Demo

torus

Beste Tetris joko bat sasi-3D bertsioan.

torus HTML5 Showcase: 48 Flash Killing Potentzial Demo


Artikuluaren edukia gure printzipioekin bat dator etika editoriala. Akats baten berri emateko egin klik hemen.

7 iruzkin, utzi zurea

Utzi zure iruzkina

Zure helbide elektronikoa ez da argitaratuko.

*

*

  1. Datuen arduraduna: Miguel Ángel Gatón
  2. Datuen xedea: SPAM kontrolatzea, iruzkinen kudeaketa.
  3. Legitimazioa: Zure baimena
  4. Datuen komunikazioa: datuak ez zaizkie hirugarrenei jakinaraziko legezko betebeharrez izan ezik.
  5. Datuak biltegiratzea: Occentus Networks-ek (EB) ostatatutako datu-basea
  6. Eskubideak: Edonoiz zure informazioa mugatu, berreskuratu eta ezabatu dezakezu.

  1.   Txupatina esan zuen

    TETRISA EZ DOA, BI PIEZA SARTZEN DITUT ETA ZUTIK BAINA ATSEDENA OSO CHAVAL HOLIDEA DA.

  2.   Elisa esan zuen

    Orrialde hau maite dut ... lehenengo jokoa izan ezik. Maite zaitut Fran =)
    Bye musu bat munduari ere baioooooooo

  3.   Helsikoa esan zuen

    Izugarria, ikusgarria. Ezin dut sinetsi noraino iritsi den web garapena!

  4.   Joe vega esan zuen

    Ez dakit baliabide horiek zergatik egotzi zaizkien HTML5ari, hau Javascript hutsa da, Flasharen sorrera baino lehen, Javascript-ekin gauza horiek guztiak egin zitezkeen. Bartzelonan ikerketa bat egin zen, garai hartan buruak lehertu zituzten zenbait gune egin zituena, guztia javascript-en hainbeste eurekin ikasi nuen eta pilotak errebotatzeko bikotea diseinatu nuen eta guzti, guztiz galdu nituen eta oraindik damutzen naiz. Ez dut gogoan estudioaren izena 2an edo gutxi gora behera zu2 edo 2you98 bezalako zerbait zen.

  5.   ASDF esan zuen

    Joe Vega …… erakusten du ez duzula HTML5aren ideia izorraturik… .lol

  6.   Joe vega esan zuen

    Agian ez duzu html5 ideia odoltsurik izango, egia da, baina oilarra oilategiarekin nahasten duzu eta ez duzu hizkuntza bat ingurune batetik bereizten. Hemen bezalako adibide bat javascript erabili gabe egiteko desafioa egiten dizut, html5-rekin soilik, eta ezabatu nuen mezuan zer esan nahi nuen ulertuko duzu. Are gehiago, adibideen iturburu kodea aztertzen aritu naiz eta html5 bidez muntatu gabe erraz egin daitezkeen hainbat daude.
    HTML5-ek hobekuntza ugari ekartzen ditu eta asko errazten duten gauzak egia da, baina orrialde honetan agertzen den gauza fantastikoaren erramuak Javascript da.

  7.   Santiago Barchetta esan zuen

    Mota honetako aurkezpenak egitea interesatzen zait ... tutorial edo orririk duzu baliabideekin ??? Eskerrik asko!!!