Arrastrar y soltar foto
Publicado por Jean (22 intervenciones) el 11/03/2021 21:32:14
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function iniciar(){
origen1=document.getElementById('imagen');
origen1.addEventListener('dragstart', arrastrado, false);
destino=document.getElementById('cajasoltar');
destino.addEventListener('dragenter', function(e){
e.preventDefault(); }, false);
destino.addEventListener('dragover', function(e){
e.preventDefault(); }, false);
destino.addEventListener('drop', soltado, false);
}function arrastrado(e){
var codigo='<img src="'+origen1.getAttribute('src')+'">';
e.dataTransfer.setData('Text', codigo);
}function soltado(e){
e.preventDefault();
destino.innerHTML=e.dataTransfer.getData('Text');
}window.addEventListener('load', iniciar, false);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE html>
<html>
<head>
<style>
#cajasoltar{float: left;width: 500px;height: 300px;margin: 10px;border: 1px solid #999999;
}#cajaimagenes{float: left;width: 320px;margin: 10px;border: 1px solid #999999;
}#cajaimagenes > img{float: left;padding: 5px;}</style></p>
<script src="arrastrar.js"></script>
</head></p>
<body>
<section id="cajasoltar">
Arrastre y suelte la imagen aquí
</section></p>
<section id="cajaimagenes">
<img id="imagen1" id="img" src="246x0w.jpg" width="100" height="100"/>
</section>
</body>
</html>
Hola, tengo estos codigos, y por algun motivo no funciona, lo he comparado con varios codigos similiares y no logro dar con el fallo.
El primero es el archivo llamado arrastrar que se llama en el segundo
Gracias
Valora esta pregunta
0
