基本思路是监听鼠标位置和dom元素的位置，通过判断鼠标的位置是否与dom元素的位置重叠，来实现相应的效果。

    /* 鼠标特效代码 */ 
    // 获取dom坐标
    function XY(dom){
      let Top = dom.offsetTop;
      let maxTop = dom.offsetTop+dom.offsetHeight;
      let Left = dom.offsetLeft;
      let maxLeft = dom.offsetLeft+dom.offsetWidth;
      let y = [Top,maxTop]
      let x = [Left,maxLeft];
      return [x,y];
    }
    // 获取鼠标坐标
    function mouseXY(event) {
      let e = event || window.event;
      let z = [e.clientX,e.clientY];
      return z
    }
    // 鼠标悬停menu上的效果
    function menuFloatOver() {
      let menu = document.getElementById("menu");
      menu.style.width = "132px";
      menu.style.left = "calc(100% - 142px)";
      let menuMuds = document.getElementsByClassName("menuMud");
      let menuMud_warning = document.getElementById("menuMud_warning");
      try {
        menuMud_warning.style.display = "block";
      }catch(e){}
      for (let i = 0; i < menuMuds.length; i++){
        menuMuds[i].style.display = "flex";
      }
    }
    // 鼠标离开menu上的效果
    function menuFloatOur() {
      let menu = document.getElementById("menu");
      menu.style.width = "10px";
      menu.style.left = "calc(100% - 20px)";
      let menuMuds = document.getElementsByClassName("menuMud");
      let menuMud_warning = document.getElementById("menuMud_warning");
      try {
        menuMud_warning.style.display = "none";
      }catch(e){}
      for (let i = 0; i < menuMuds.length; i++){
        menuMuds[i].style.display = "none";
      }
    }
    // 鼠标悬停在search框上的效果
    function searchFloatOver(){
      let search = document.getElementById("search");
      search.style.transform = "scale(1.2,1.2)"
      search.style.backgroundColor = "rgb(255, 255, 255,0.8)"
      search.style.boxShadow = "0px 2px 6px rgba(255, 255, 255, 0.6)"
    }
    // 鼠标离开search框上的效果
    function searchFloatOur(){
      let search = document.getElementById("search");
      search.style.transform = "scale(1,1)"
      search.style.backgroundColor = "rgb(255, 255, 255,0.6)"
      search.style.boxShadow = "0px 2px 6px rgba(255, 255, 255, 0)"
    }
    // 鼠标悬停的核心
    function FloatCore(mouseXY,XY,FloatOver,FloatOur){
      let X = XY[0]
      let Y = XY[1]
      let Xmin = X[0]
      let Xmax = X[1]
      let Ymin = Y[0]
      let Ymax = Y[1]
      let mouseX = mouseXY[0]
      let mouseY = mouseXY[1]

      if (mouseX >= Xmin && mouseX <= Xmax && mouseY >= Ymin && mouseY <= Ymax){
        FloatOver()
      }else {
        FloatOur()
      }
    } 
    // 鼠标悬停程序
    function floatXY(event) {
      let mouse_xy = mouseXY(event);
      // 获取menu坐标
      let menu = document.getElementById('menu');
      let menuXY = XY(menu)
      // 获取search坐标
      let search = document.getElementById('search');
      let searchXY = XY(search)
      FloatCore(mouse_xy,menuXY,menuFloatOver,menuFloatOur) // 鼠标在menu上悬停
      FloatCore(mouse_xy,searchXY,searchFloatOver,searchFloatOur) // 鼠标在search上悬停
    }
    document.addEventListener("mousemove",floatXY);
    /* end */