我想知道是否可以使用 JS/jQuery 在将图像拖放到 div 后自动缩放(放大)图像到 div 的完整大小？
*请注意，图像不会从其原始位置消失，而是该图像的副本将被拖放到 div 中(所以它确实是我需要缩放的副本)。
我有当前的代码来拖放复制图像(见下文)，但我不知道是否可以自动缩放，如果可以，如何...提前致谢!
<html>
<img id="drag1" src="image.jpg" draggable="true" ondragstart="drag(event)">
<div id="dropBox" ondrop="dropcopy(event)" ondragover="allowDrop(event)"></div>
</html>
<style>
#drag1{width:100px;height:50px;}
#dropBox{width:500px;height:250px;}
</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));
}
function dropcopy(ev){
ev.preventDefault();
var data=ev.dataTransfer.getData("Text");
var copyimg = document.createElement("img");
var original = document.getElementById(data);
copyimg.src = original.src;
ev.target.appendChild(copyimg);
}
</script>
最佳答案
既然可以使用 CSS，为什么还要使用 jQuery？
img{width:100%;}
关于javascript - 如何在拖放图像后将图像缩放到 div 上的完整大小？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32665309/