沿对角线拖放？

Question

是否存在拖放解决方案的示例,其中被拖动的元素只能沿着斜线移动？例如,约束元素的可拖动性,使其只能沿30º线或10º等移动.

我能够找到的大多数示例仅将拖动元素的区域约束为垂直或水平线,或者更大的父div.

可能相关:沿对角线拖动不超过100px,或沿曲线拖动.

Answer 1

完整示例（仅限 FF）

<div id="drag" style="position:absolute;width:20px;height:20px;background:red"></div>
<script>
var angle = 10;
window.onload = function() 
{
    var d = document.getElementById("drag");
    d.onmousedown = function() {
        document.onmouseup = function() {
            document.onmousemove = null;
        }
        document.onmousemove = function(e) {
            d.style.left = e.clientX;
            d.style.top = e.clientX * Math.tan(angle * Math.PI / 180);
        }
    }
}
</script>