資料介紹

• 網頁設計教程/視頻教程/軟件
• 計算機資料

語言：英語
網址：http://www.lynda.com/HTML-5-tutorials/HTML5-Drag-and-Drop-in-Depth/84812-2.html
類別：教程



（xuehui@TLF）
Lynda.com 出品的時長1小時的 深入學習HTML5的拖放功能 視頻教程。由Bill Weinman演示了JavaScript和HTML5的聯合運用，使幾乎所有的網頁元素都可以拖動，並且能夠增強浏覽器的支持而不再需要外部數據庫(比如jQuery)的技術。內容包括檢測用戶浏覽器的拖放支持，編寫一個簡單事件監聽程序，使用拖放區。舉例一個簡單運作的游戲，實踐能夠適用於幾乎任何網站上拖放功能的執行。本教程附帶練習文件。

Course name:
HTML5: Drag and Drop in Depth

Author:
Bill Weinman

Duration:
01h 00m

Released on:
7/26/2011

In HTML5: Drag and Drop in Depth, Bill Weinman shows how to make just about any web page element draggable with a combination of JavaScript and HTML5, a technique that has increased browser support and that eliminates the need for external libraries such as jQuery. The course covers how to detect drag-and-drop support in the user's browser, code a simple event listener, use a drop zone, and even receive dropped objects without a drop zone. A simple working example game, a practical implementation of drag-and-drop that can be applied to almost any web site, is also demonstrated. Exercise files are included with the course.

Topics include:
Exploring the HTML/Javascript/CSS/DOM relationship
Detecting drag and drop support
Using the HTML5 draggable and dropzone attributes and onDragStart event
Exploring different events
Receiving drops with or without a drop zone
Creating a simple game