2009-10-26 17 views
5

HTML 5 ist die neue W3C-Definition für HTML und wird wahrscheinlich die Richtung darstellen, in die das Internet geht, wenn die Leute die nächsten Killer-Apps finden, die darin funktionieren.HTML 5 - Sneaky Zeug

Es gibt die viel publizierten "öffentlichen" Codierungsfunktionen wie dasTag, aber ich frage mich, welche Low-Level-Coding-Tricks die Leute bisher gefunden haben, die wichtig, nützlich, interessant oder alle der oben genannten sein könnten.

Einige Beispiele Ich habe über so weit gekommen:

Drag-and-Drop-Ereignisse, die die Datenübertragung steuern - zB:

document.addEventListener("dragstart", function(event) 
{ 
    event.dataTransfer.setData("image/png", slides.imageRep()); 
    event.dataTransfer.setData("slides", slides.serializedRep()); 
    // etc. 
}, false) 

2-dimensionale und 3-dimensionale Grafiken durch Erweiterung des Elements <canvas>.

Context-aware html Blöcke

(als Bonus - die obselecense der <applet> und <marquee> tags - woohoo!)

<ruby> Tag für ideographs

und ich bin nicht sicher, ob dies ist neu, aber das <progress>-Tag - diese dynamisch aktualisierbare Tags werden das Web eine reichere Erfahrung machen.

Jeder spielte mit diesen und fand einige interessante Beispiele von ihnen zusammen? Irgendein Demo-Code vielleicht?

+0

Bitte stellen Sie diese Frage "Community Wiki". Du hast nicht vor, irgendwann eine Antwort zu akzeptieren, oder? – innaM

+0

gut, wenn es eine definitive Antwort gibt, sicher, aber ansonsten denke ich, es ist ein Wiki? –

+0

zu Wiki geändert –

Antwort

2

Es gibt schöne Proben auf Chrome Experiments

Von der über Seite:

Diese Experimente wurden von Designern und Programmierern erstellt aus der ganzen der Welt die neuesten offenen Standards, einschließlich HTML5, Canvas , SVG, und mehr

1

Check out Bespin, fr om Mozilla Labs - es ist ein Code-Editor, der vollständig in JavaScript mit Canvas geschrieben wurde.

Auch kann es nicht ein "Probe" per se sein, aber die Canvas Tutorial auf dem Mozilla Developer Center ist eine sehr gute Einführung in das <canvas /> Element.