<html>
<head>
<title>Left</title>
</head>
<body style="margin:0; padding:0">
<script>
function log(message) {
console_doc = parent.frames[2].document;
var item = console_doc.createElement("li");
item.appendChild(console_doc.createTextNode(message));
console_doc.getElementById('console_messages').appendChild(item);
}
</script>
<div style="width:150; height:75; text-align:center;">
<a id="elementToDrag"
href="#"
style="position: relative; top: 50"
ondrag="log('ondrag src')"
ondragstart="log('ondragstart src')"
ondragend="log('ondragend src')"
ondragenter="log('ondragenter src')"
ondragover="log('ondragover src')"
ondragleave="log('ondragleave src')"
ondrop="log('ondrop src')">
Drag me
</a>
</div>
<div id="dragTarget"
style="width:150; height:150; background-color:lightgreen; text-align:center;"
ondrag="alert('ondrag left target')"
ondragstart="alert('ondragstart left target')"
ondragend="alert('ondragend left target')"
ondragenter="log('ondragenter left target'); return false;"
ondragover="log('ondragover left target'); return false;"
ondragleave="log('ondragleave left target')"
ondrop="log('ondrop left target')">
<span style="position: relative; top: 50">Here</span>
</div>
<p><a href="http://bugs.webkit.org/show_bug.cgi?id=7323" target="_top">Bug 7323</a>:
REGRESSION (10.4.4): ondrag* events don't fire on page in a frame</p>
<p>This test works only in automatic mode, but you can also try dragging manually to compare the results with other browsers.</p>
</body>
</html>