JavaScript函数在单击时终止

我正在用JavaScript做一个函数，让立方体跟随鼠标移动，但我需要让它们回到我在特定div上悬停时的原始位置，并且只要鼠标在该div内就停止移动。如果我将鼠标移到按钮内，立方体不会移动，但在我离开按钮后会返回移动

函数多维数据集（）{
$（文档）.on（“mousemove”，函数（e）{
$（“.cube1”）.attr（“样式”，“转换：translateX”（+ax+”px）
translateY（“+ay+”
px）
");
});
};
$（“.button”）.hover（函数（）{
$（“.cube1”）.css({
“转换”：“转换（0）”
})
});
。按钮{
宽度：200px；
高度：200px；
}
我不知道这是一个答案，但您这里有一点输入错误：

$(".cube1").css({"transform":"translate(0)"})

您需要捕获
按钮上的
mousemove
事件，然后使用以防止事件从DOM冒泡到文档


函数多维数据集（）{
$（文档）.on（“mousemove”，函数（evnt）{
设{clientX，clientY}=evnt；
$（“.cube1”）.css（'transform'，`translateX（${clientX}px）translateY（${clientY}px）`）；
});
$（“.button”）.on（'mouseenter'，function（）{
//当鼠标进入按钮捕捉
//立方体1返回其默认位置
$（“.cube1”）.css({
“转换”：“转换（0）”
});
});
$（“.button”）.on（'mousemove'，函数（evnt）{
//捕获此元素上的mousemove事件，
//并停止传播，使文档不会收到
//鼠标移动事件。
evnt.stopPropagation（）；
});
}
立方体（）
。按钮{
宽度：200px；
高度：200px；
背景#96bdd9；
}
.cube1{
高度：50px；
宽度：50px；
背景：#e1ecf4；
}

立方体
按钮
谢谢，但这并不是解决方案，即使是将其恢复到原始位置，但根据鼠标坐标保持移动。
ax
和
ay
从何而来？当询问有关堆栈溢出的问题时，请确保提供一个完整的解决方案。