hover - 悬停以触发工具提示和菜单动画

Question

如何组合对事件的操作。因此，悬停将为菜单设置动画并显示附加到该菜单项的工具提示。

我现在正在使用 lavalamp 和 beautytips 插件。

Answer 1

您需要探索事件侦听器与事件处理程序。例如：

// Event handlers are declared like this:

var elm = document.getElementById("someElement");

elm.onmouseover = function() { 
  elm.innerHTML = "OVER state has been triggered!";
}

以这种方式编写，每个元素都可以有一个事件功能。

事件侦听器允许您为事件附加任意数量的函数。它们是 IE 和 FF 中的不同脚本，但做同样的事情。使用原始 javascript，您可以附加如下事件：

function listenFor(obj,eventName,fcnRef,bubbling) {
  if(!bubbling) { bubbling= false; }
  if(!obj.addEventListener) { obj.attachEvent("on"+eventName,fcnRef); }
  else { obj.addEventListener(eventName,fcnRef,otherthing); }
};

function handler1() {
  this.style.border = '2px solid red';
}

function handler2() {
  this.style.background = 'green';
}

listenFor(elm,"over",handler1);
listenFor(elm,"over",handler2);

像 JQuery 和其他库这样的库有类似的方法来做到这一点。关于这个主题的一些研究和实验应该会给你足够的信息来动画菜单并在同一元素上同时显示工具提示。