HTML 5 - 비열한 것

Question

HTML5 HTML에 대한 새로운 W3C 정의이며 사람들이 인터넷에서 작동하는 다음 킬러 앱을 찾을 때 인터넷이 가는 방향을 나타낼 가능성이 높습니다.

다음과 같이 널리 알려진 '공개' 코딩 기능이 있습니다. <video> 태그가 있지만 지금까지 사람들이 발견한 중요하거나 유용하거나 흥미로울 수 있는 저수준 코딩 트릭이 무엇인지 궁금합니다.

지금까지 내가 접한 몇 가지 예는 다음과 같습니다.

데이터 전송을 제어하는 ​​드래그 앤 드롭 이벤트 - 예:

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

확장을 통한 2차원, 3차원 그래픽 <canvas> 요소.

컨텍스트 인식 HTML 블록

(보너스로 - <applet> 그리고 <marquee> 태그 - 우후!)

<ruby> 표의 문자용 태그

이것이 새로운 것인지는 확실하지 않지만, <progress> 태그 - 동적으로 업데이트 가능한 태그는 웹을 더욱 풍부한 경험으로 만들어줍니다.

누구든지 이것들을 가지고 놀았고 그것들이 합쳐진 몇 가지 흥미로운 예를 발견했습니까?아마도 데모 코드가 있을까요?

Answer 1

좋은 샘플이 있어요 Chrome 실험

정보 페이지에서:

이 실험은 HTML5, Canvas, SVG 등을 포함한 최신 개방형 표준을 사용하여 전 세계의 디자이너 및 프로그래머가 만들었습니다.

Answer 2

확인해 보세요 베스핀, Mozilla Labs에서 제작 - Canvas를 사용하여 완전히 JavaScript로 작성된 코드 편집기입니다.

또한, 그 자체로는 "샘플"이 아닐 수도 있지만, 캔버스 튜토리얼 Mozilla 개발자 센터에 있는 Mozilla 개발자 센터에 대한 아주 좋은 소개가 있습니다. <canvas /> 요소.