Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

507

Chapter 13 Drag and drop

CHAPTER 13 Drag and drop

P

rior to HTML5, the ability to drag and drop operations was possible with some browsers

but wasn’t compatible across different browsers. You typically implemented drag and

drop by using a third-party library such as jQuery. Drag and drop is a first-class citizen of

HTML5, which is the first step toward having a compatible implementation across browsers.

You might still use jQuery for other functionality, but it’s not required for drag and drop.

This chapter shows you how to drag and drop from one location to another on the web-

page and then how to to drag and drop files.

Lessons in this chapter:

■■Lesson 1: Dragging and dropping 507

■■Lesson 2: Dragging and dropping files 517

Before you begin

To complete this book, you must have some understanding of web development. This

chapter requires the hardware and software listed in the “System requirements” section in

the book’s Introduction.

Lesson 1: Dragging and dropping

Making drag and drop part of HTML5 means that you can get browser compatibility and

browser integration and, as you’ll see in Lesson 2, “Dragging and dropping files,” you can

achieve integration with the operating system.

After this lesson, you will be able to:

■■Describe HTML5 drag and drop.

■■Implement drag and drop using HTML5.

Estimated lesson time: 20 minutes