如何使用CSS3 Transform.translate设置元素的实际位置？

Question

我有2个输入按钮

我想在鼠标悬停/按钮点击时将btn1移动到btn2以下。我提到http://www.quirksmode.org/js/findpos.html来获取btn2的位置，并相应地给出了Transform和translate方法的x和y。但是btn1移动到页面上的不同位置。给予translate方法的坐标没有按预期工作。 需要帮助来确定要转换的正确坐标。

Answer 1

translate的坐标相对于元素的原始位置。如果您希望那些代表页面上的绝对位置，请先将元素设置为0,0：

position: absolute;
top: 0;
left: 0;

可能更好的方法（没有绝对定位）是获取两个元素的位置，计算差异并将其传递给translate。