JavaScript/DOM/Event/dragend
Aus SELFHTML-Wiki
< JavaScript | DOM | Event
Der dragend-Event-Handler Der Eventhandler dragend feuert, wenn Sie ein Element oder eine Textauswahl gezogen und losgelassen haben.
bubbles |
ja |
---|---|
cancelable |
ja |
mögliche Auslöser |
allen Elementen |
Event-Objekt |
Drag-Event |
var dragged;
/* events fired on the draggable target */
document.addEventListener("drag", function(event) {
}, false);
document.addEventListener("dragstart", function(event) {
// store a ref. on the dragged elem
dragged = event.target;
// make it half transparent
event.target.style.opacity = .5;
}, false);
document.addEventListener("dragend", function(event) {
// reset the transparency
event.target.style.opacity = "";
}, false);
/* events fired on the drop targets */
document.addEventListener("dragover", function(event) {
// prevent default to allow drop
event.preventDefault();
}, false);
document.addEventListener("dragenter", function(event) {
// highlight potential drop target when the draggable element enters it
if (event.target.className == "dropzone") {
event.target.style.background = "purple";
}
}, false);
document.addEventListener("dragleave", function(event) {
// reset background of potential drop target when the draggable element leaves it
if (event.target.className == "dropzone") {
event.target.style.background = "";
}
}, false);
Siehe auch
Weblinks
- MDN: Dragend Event