The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> opload to div help, opload
snookie
post Mar 30 2019, 11:46 AM
Post #1





Group: Members
Posts: 4
Joined: 30-March 19
Member No.: 26,866



I have now this code there i can drag image back and forth between two div elements

But i want to click on the div elements and i get file dialog window to choose a file
and it will be show on the div elements...

Here its my code


<html>
<head>
<style>
#div1, #div2 {
float: left;
width: 100px;
height: 35px;
margin: 10px;
padding: 10px;
border: 1px solid black;
}
</style>
<script>
function allowDrop(ev) {
ev.preventDefault();
}

function drag(ev) {
ev.dataTransfer.setData("text", ev.target.id);
}

function drop(ev) {
ev.preventDefault();
var data = ev.dataTransfer.getData("text");
ev.target.appendChild(document.getElementById(data));
}
</script>
</head>
<body>

<h2>Drag and Drop</h2>
<p>Drag the image back and forth between the two div elements.</p>

<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
<img src="2hånd.jpg" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31">
</div>

<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>

</body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic
snookie   opload to div help   Mar 30 2019, 11:46 AM
snookie   and i have this code to... But its work then i dro...   Mar 30 2019, 12:00 PM


Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 21st January 2020 - 04:14 PM