Javascript 鼠标移动时在div内移动div

有人能帮我解决一个问题吗。所以我有两个div div1需要是浏览器屏幕的高度和宽度，并隐藏溢出

在这个div中，我有另一个div div2，它的宽度和高度是第一个div的两倍。然后我需要在鼠标移动时移动这个div

#查看窗口{
宽度：100%；
身高：100%；
溢出：隐藏；
位置：相对位置；
}
#背景包装{
背景：url（'../images/background.png'）无重复中心；
背景大小：100%100%；
位置：绝对位置；
}

使用以下代码：

$（文档）.ready（函数（）{
变量$moveable=$（'.moveable'）；
$（文档）.mousemove（函数（e）{
$moveable.css（{'top'：e.pageY，'left'：e.pageX}）；
});
$（“.outer”）.height（$（window.height（））；
$（“.outer”）.width（$（window.width（））；
});
。可移动{
位置：绝对位置；
}
.info{
背景色：红色；
高度：50px；
宽度：50px；
}

尝试以下代码：



#移动{
高度：100px；
宽度：100px；
位置：绝对位置；
排名：0；
左：0；
背景：绿色；
}
var div=document.getElementById（'move'）；
document.addEventListener（'mousemove'，函数（e）{
div.style.left=e.pageX+“px”；
div.style.top=e.pageY+“px”；
});
这是我想要的想法，但它必须是当我的鼠标位于右下角时，红色框的左上角必须位于外部div的左上角。如果这有意义？有点像这样，但是当我的鼠标位于视图框的左上角时，红色框的左上角也应该位于该角。好的，我知道你的问题了。。让您知道一次，我会找到解决方案的可能副本