🐷以前用js写一个简易版找茬游戏运营推广活动，判断点击的元素和答案的元素是否相交

体验地址(建议切换手机模式)

✨判断答案的块元素和触摸的块元素是否相交

const rect1 = { x: 100, y: 100, width: 100, height: 100 }
const rect2 = { x: 150, y: 150, width: 100, height: 100 }
isOverlap(rect1, rect2) // => true

//方法
const isOverlap = (rect1, rect2) => {
  const l1 = { x: rect1.x, y: rect1.y }
  const r1 = { x: rect1.x + rect1.width, y: rect1.y + rect1.height }
  const l2 = { x: rect2.x, y: rect2.y }
  const r2 = { x: rect2.x + rect2.width, y: rect2.y + rect2.height }
  if (
    l1.x > r2.x ||
    l2.x > r1.x ||
    l1.y > r2.y ||
    l2.y > r1.y
  ) return false
  return true
}

this.$refs.xxx.getBoundingClientRect().top 获取Y轴高度 this.$refs.xxx.getBoundingClientRect().left 获取x轴位置

获取点击反馈的位置

    /**
     * [mouseup 监听mouse事件 鼠标点击的位置]
     * clientX：点击目标在视口中的x坐标
     * clientY：点击目标在视口中的y坐标。
     * btnX和btnY用于计算触摸反馈样式的位置
     */
    mouseUp(ev) {
      ev = ev || event;
      ev.preventDefault();
      
      this.btnX = ev.pageX
      this.btnY = ev.pageY
    },