修改css样式，当列表变化时，tip提示始终在鼠标上方一行

如果你想要实现当列表变化时，工具提示始终在鼠标上方一行的效果，你可以使用 JavaScript 监听鼠标移入事件，并动态计算工具提示的位置，使其始终在鼠标上方一行。以下是一个简单的示例代码：

// 获取列表元素和工具提示元素
const list = document.querySelector('.list');
const tooltip = document.querySelector('.tooltip');

// 监听列表的鼠标移入事件
list.addEventListener('mouseenter', (event) => {
  // 获取鼠标的坐标和列表项的高度
  const x = event.clientX;
  const y = event.clientY;
  const itemHeight = event.target.offsetHeight;

  // 计算工具提示的位置
  const tooltipTop = y - itemHeight;
  const tooltipLeft = x;

  // 设置工具提示的位置
  tooltip.style.top = `${tooltipTop}px`;
  tooltip.style.left = `${tooltipLeft}px`;
});

这段代码中，我们首先获取了列表元素和工具提示元素，然后使用 `addEventListener` 方法监听列表的 `mouseenter` 事件。在事件处理函数中，我们使用 `event` 对象的 `clientX` 和 `clientY` 属性获取鼠标相对于窗口的坐标，同时使用 `event.target.offsetHeight` 属性获取当前鼠标所在的列表项的高度。然后根据这些值计算工具提示的位置，使其始终在鼠标上方一行。最后，使用 `style` 属性设置工具提示的 `top` 和 `left` 样式属性，即可实现工具提示始终在鼠标上方一行的效果。