鼠标位置、元素相对文档位置

// 鼠标放在飞行区域， 飞机随着移动
var map = $('#map')
var fly = $('#hero')
map.mousemove(function (e) {
  var x = e.clientX // 鼠标指针位置相对于当前窗口的X 坐标， 不包括窗口的自身控件和滚动区域
  var y = e.clientY // 鼠标指针位置相对于当前窗口的y 坐标
  var w = fly.width() // 飞机的宽
  var h = fly.height() // 飞机的高
  fly.css('left', x - w / 2 + 'px') // 飞机定位相对于左侧的距离，和鼠标位置有关
  fly.css('top', y - h / 2 + 'px')
  if (fly.offset().left < 0) {
    fly.css('left', 0)
  }
  if (fly.offset().left > (map.width() - w) ) {
    fly.css('left', map.width() - w + 'px')
  }
  if (fly.offset().top < 0) {
    fly.css('top', 0)
  }
  if (fly.offset().top > (map.height() - h)) {
    fly.css('top', map.height() - h + 'px')
  }
})