Skip to content

Instantly share code, notes, and snippets.

@masone
Created April 26, 2016 14:16
Show Gist options
  • Save masone/27709f15d2933c2b9ca7d1df07266c0b to your computer and use it in GitHub Desktop.
Save masone/27709f15d2933c2b9ca7d1df07266c0b to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>iframe</title>
<meta charset="utf-8">
<style>
[draggable=true] {
-khtml-user-drag: element;
-webkit-user-drag: element;
-khtml-user-select: none;
-webkit-user-select: none;
}
</style>
</head>
<body>
<div id="drop">
This is a "target" object
This is a "target" object
This is a "target" object
This is a "target" object
This is a "target" object
This is a "target" object
This is a "target" object
This is a "target" object
This is a "target" object
</div>
<script>
document.addEventListener('dragstart', function(event) {
console.log('dragstart');
}, false);
document.addEventListener('dragend', function(event) {
console.log('dragend');
}, false);
document.getElementById("drop").addEventListener('dragover', function(event) {
console.log('dragover');
}, false);
document.getElementById("drop").addEventListener('dragenter', function(event) {
console.log('dragenter');
}, false);
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>iframe</title>
<meta charset="utf-8">
<style>
[draggable=true] {
-khtml-user-drag: element;
-webkit-user-drag: element;
-khtml-user-select: none;
-webkit-user-select: none;
}
</style>
</head>
<body>
<a href="#" id="toDrag" draggable="true">This is a draggable item</a>
<div id="drop">This is a "target" object</div>
<br/>
<br/>
<iframe width="800" height="500" src="iframe.html"></iframe>
<script>
document.addEventListener('dragstart', function(event) {
console.log('dragstart');
}, false);
document.addEventListener('dragend', function(event) {
console.log('dragend');
}, false);
document.getElementById("drop").addEventListener('dragover', function(event) {
console.log('dragover');
}, false);
document.getElementById("drop").addEventListener('dragenter', function(event) {
console.log('dragenter');
}, false);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment