HTML and CSS Reference
In-Depth Information
Interoperability of dragged data
By using the setData and getData methods on the dataTransfer
object, you can pass data from elements inside our application
to other pages of our app, or across browser windows—as 280
Slides has prototyped, when dragging one slide from one window
to another completely separate document ( Figure 8.2 ). Finally
you can also accept or send data to native desktop applications.
FIGURE 8.2 An early
prototype of how drag and drop
could work in 280 Slides.
Dragging data to other applications
So long as you know what the accepted content types are, you
can set the data type to that content type, and when you drag
content from your application to that application. For example,
on a Macintosh, the desktop accepts text snippets to be dragged
onto it. I can construct my own content, set the content type
to text/plain, and when I drag to the desktop (using Chrome or
Safari), a text snippet is created with my content ( Figure 8.3 ):
img.ondragstart = function (event) {
event = event || window.event;
// here be one long line
event.dataTransfer.setData('text/plain',
'This is the screen name for ' + this.getAttribute
¬ ('data-screen_name') +
', whose image can be found here: ' + this.src);
};
 
 
Search WWH ::




Custom Search