我使用此代码从某处获取,用于学习目的。如果你能帮助我更好地掌握它,我试图将其分解并理解它是如何做的。
此函数返回鼠标与相应元素之间的距离。
function calculateDistance(elem, mouseX, mouseY) {
return Math.floor(Math.sqrt(Math.pow(mouseX - (elem.offset().left+(elem.width()/2)), 2) + Math.pow(mouseY - (elem.offset().top+(elem.height()/2)), 2)));
}
它返回一个正数,仅计算鼠标和元素之间的像素。
剥离它并只留下Math.floor。我不知道为什么没有math.sqrt(math.pow ...)我会得到负值,这取决于与元素相关的鼠标位置 - >左(-x),右(x),上(-y),下(y)元素
并获得该元素的不同中心。
function calculateDistance(elem, mouseX, mouseY) {
return Math.floor(mouseX - (elem.offset().left+(elem.width()/2)) + mouseY - (elem.offset().top+(elem.height()/2)));
}
我知道Math.pow和sqrt自己做了什么。我没有看到他们如何找到元素的中心,因为我认为elem.offset().left+(elem.width()/2)
正在水平地进行,elem.offset().top+(elem.height()/2)
垂直地做了。
答案 0 :(得分:3)
它是毕达哥拉斯定理,a²+b²=c²,其中有(x)和b(y)并搜索c(距离)
答案 1 :(得分:3)
所以 1
<!DOCTYPE html>
<html>
<head>
<title>HTML5, CSS3 and JavaScript demo</title>
</head>
<body>
<textarea id="custom-css-text">testing</textarea>
</body>
</html>
2 是
is elem.width()/2
添加
elem.height()/2
你得到元素的中心。
获得 3
elem.offset().left and elem.offset().top
你
获得 4mouseX - (elem.offset().left+(elem.width()/2)
最后,为了找到鼠标指针与元素之间的距离,你必须使用旧的毕达哥拉斯定理a²+b²=c²。要查找边的平方 3 和 4 ,请使用Math.pow()。关于你的问题为什么当你删除它时它返回一个负整数是一个数字的平方总是正数,无论你是正方形还是负数。例如,在这种情况下, 3 (mouseX - (elem.offset()。left +(elem.width()/ 2))的结果将为负数,因为鼠标位于左侧元件。
如果距离平方,这将给你长度,这就是为什么你需要使用Math.sqrt从c²得到c。
最后,Math.floor仅用于向下舍入到最接近的整数。
答案 2 :(得分:1)
我知道Math.pow和sqrt自己做什么
他们正在实施Pythagoras' theorem
我没有看到他们如何找到元素的中心,因为我认为elem.offset()。left +(elem.width()/ 2)只是在水平上同时执行elem。 offset()。top +(elem.height()/ 2)垂直地做了
这正是开发人员在这里所做的事情。
mouseX - (elem.offset().left+(elem.width()/2))
对应于&#39; a&#39;在链接图中,elem.offset().top+(elem.height()/2)
对应于b