Java Reference
In-Depth Information
The second change is the addition of the
complete
property to one of the
yepnope
objects. It's
set to the aforementioned
init()
function, and it always executes—either when the resources are
completely loaded, or immediately for browsers that do not need the resources.
revisiting Native Drag and Drop
trY it out
As mentioned earlier in this section, IE8 supports native drag and drop, but it doesn't support the
draggable
attribute/property. In this example, you revisit
ch10 _ example21.html
and use Modernizr to
load two polyfills: one to support
draggable
, and another to support the standard DOM event model.
These polyfills are written by Jeremy and are provided in the code download. They are
event‐polyfill.js
and
draggable‐polyfill.js
. Both are open source. Loading these polyfills
will make this example work with minimal modifications to the existing code.
Open your text editor and type the following:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Chapter 17: Example 1</title>
<style>
[data-drop-target] {
height: 400px;
width: 200px;
margin: 2px;
background-color: gainsboro;
float: left;
}
.drag-enter {
border: 2px dashed #000;
}
.box {
width: 200px;
height: 200px;
}
.navy {
background-color: navy;
}
.red {
background-color: red;
}
</style>
<script src="modernizr.min.js"></script>
</head>
<body>
<div data-drop-target="true">
<div id="box1" draggable="true" class="box navy"></div>
<div id="box2" draggable="true" class="box red"></div>