Nu har jeg næsten fundet ud af det! Jeg plankede nedenstående kode fra et website og modificerede den lidt. Det eneste der mangler er reload af siden med variablerne, men det burde være en smal sag :-D
<html>
<head>
<title>Shopping Anyone?</title>
<script language="JScript"><!--
// the object that you are dragging:
var srcObj = new Object;
// string to hold source of object being dragged:
var dummyObj;
function startDrag(){
// get what is being dragged:
srcObj = window.event.srcElement;
// store the source of the object into a string acting as a dummy object so we don't ruin the original object:
dummyObj = srcObj.outerHTML;
// post the data for Windows:
var dragData = window.event.dataTransfer;
// set the type of data for the clipboard:
dragData.setData('Text', window.event.srcElement.src);
// allow only dragging that involves moving the object:
dragData.effectAllowed = 'linkMove';
// use the special 'move' cursor when dragging:
dragData.dropEffect = 'move';
}
function enterDrag() {
// allow target object to read clipboard:
window.event.dataTransfer.getData('Text');
}
function endDrag() {
// when done remove clipboard data
window.event.dataTransfer.clearData();
}
function overDrag() {
// tell onOverDrag handler not to do anything:
window.event.returnValue = false;
}
function drop(mitlag) {
// eliminate default action of ondrop so we can customize:
window.event.returnValue = false;
// change shopping cart message:
productBarStatus.innerHTML = srcObj.myLabel + ' blev droppet på ' + mitlag;
}
// since we aren't working with an actual object, we will add our attributes manually:
function addAttribute(oObj, sVal) {
var loc = oObj.indexOf(">");
return oObj.substring(0, loc) + ' ' + sVal + '>';
}
//--></script>
</head>
<body>
<span id="lag1" style="background-color: black;width:100px; height:100px;" ondrop="drop('lag1')" ondragover="overDrag()" ondragenter="enterDrag()"><img src="../sortering1.gif" ondragstart="startDrag()" ondragend="endDrag()" myLabel="lag1" border="1" width="100" height="10"></span><br>
<span id="lag2" style="background-color: green;width:100px; height:100px;" ondrop="drop('lag2')" ondragover="overDrag()" ondragenter="enterDrag()"><img src="../sortering1.gif" ondragstart="startDrag()" ondragend="endDrag()" myLabel="lag2" border="1" width="100" height="10"></span><br>
<span id="lag3" style="background-color: navy;width:100px; height:100px;" ondrop="drop('lag3')" ondragover="overDrag()" ondragenter="enterDrag()"><img src="../sortering1.gif" ondragstart="startDrag()" ondragend="endDrag()" myLabel="lag3" border="1" width="100" height="10"></span><br>
<br><br>
<!------------------------------------PRODUCT BAR STATUS-------------------->
<div id="productBarStatus" style="font-family:arial; font-size:9pt">Drag Items Into Shopping Cart. Works in IE 5.0 only.</div>
</body>
</html>
Ny bruger
Nybegynder
Opret
Preview
