Question

你知道用普通的javascript编写的任何下拉菜单脚本，但不依赖于jQuery吗？

我知道如何使用CSS来实现这一点，但我还想添加一个漂亮的淡入淡出效果并让它等待1秒后鼠标在菜单之外，然后如果鼠标没有关闭它则关闭它。回到菜单区域。

我想我可以使用CSS＆＃34;过渡＆＃34;来实现淡入淡出效果。属性，但我不知道如何在mouseOut上添加延迟

Answer 1

我喜欢这个，它只有1.2 KB，代码很容易修改：

http://www.scriptiny.com/2008/11/drop-down-menu/

您可以通过修改“t”变量来更改时间。

Answer 2

您可以使用transition-delay - 属性并执行以下操作：

当用户进入菜单时删除“延迟级别”
在用户离开菜单时添加“延迟级别”

请参阅：https://developer.mozilla.org/en/CSS/transition-delay

或者你可以这样做（注意：只是伪代码）：

var timer       = null;

function onenter() {
    showSubMenu();
    clearTimeout(timer);
    timer = null;
}

function onleave() {
    overMenu = false;
    timer    = setTimeout( function () { hideSubMenu(); } , 1000 );
}

没有jQuery的延迟下拉菜单

2 个答案: