用jQuery判斷兩個元素是否有重疊部分
這是博問中的一個問題:http://q.cnblogs.com/q/39172/
我的方案如下:
function isOverlap(idOne,idTwo){ var objOne=$("#"+idOne), objTwo=$("#"+idTwo), offsetOne = objOne.offset(), offsetTwo = objTwo.offset(), topOne=offsetOne.top, topTwo=offsetTwo.top, leftOne=offsetOne.left, leftTwo=offsetTwo.left, widthOne = objOne.width(), widthTwo = objTwo.width(), heightOne = objOne.height(), heightTwo = objTwo.height(); var leftTop = leftTwo > leftOne && leftTwo < leftOne+widthOne && topTwo > topOne && topTwo < topOne+heightOne, rightTop = leftTwo+widthTwo > leftOne && leftTwo+widthTwo < leftOne+widthOne && topTwo > topOne && topTwo < topOne+heightOne, leftBottom = leftTwo > leftOne && leftTwo < leftOne+widthOne && topTwo+heightTwo > topOne && topTwo+heightTwo < topOne+heightOne, rightBottom = leftTwo+widthTwo > leftOne && leftTwo+widthTwo < leftOne+widthOne && topTwo+heightTwo > topOne && topTwo+heightTwo < topOne+heightOne; return leftTop || rightTop || leftBottom || rightBottom; }
原理很簡單,就是判斷一個元素的四個點是否在另一個元素內部。
Demo:
如果有其他方案歡迎提出。

浙公網安備 33010602011771號