2012-03-08 58 views
1

我想知道当用户的鼠标光标在主菜单(第1级)链接上时,子菜单(第2级)出现的延迟时间有多长。我之前已经创建了这样的菜单,并且在http://www.sbb.ch/en/home.html(例如第一个链接是“休闲&假期”)上有一个示例,在子菜单出现在大蓝色泡泡之前,我使用了延迟200ms。子菜单出现的延迟时间有多长?

我也在其他项目的菜单中使用了延迟100ms,300ms和500ms。这些值是由项目的客户选择的,可能是基于他们认为是正确的。

关于可用性的最佳延迟是多少?是否有科学测试证明这一点?

+0

您是否尝试过使用hoverintent.js? – 2012-03-08 12:45:42

+0

@TomJNowell我已经使用hoverintent,但它不是关于插件的延迟。 Hoverintent的默认延迟为0,由您来设置。但是你设置了什么? 200毫秒可能对你感觉良好,但它对每个人都是最好的吗? – 2012-03-08 12:51:11

+0

有点极端 - 给用户在帐户设置的滚动条,并让他们决定... – 2012-03-08 12:53:27

回答

0

我已经花了几个小时搜索网页,并且发现某些鼠标在菜单和子菜单上移动时应该有不同的延迟。

  1. 进入链接(鼠标悬停),因此,如果用户只是在和过去的第一级链接移动鼠标光标子菜单没有出现应该是足够长的延时。如果没有延迟,子菜单(第二级)会立即打开并且令人烦恼。这个延迟应该是在100ms和200ms之间

  2. 离开链接的延迟(mouseout)应该足够长,以便用户可以在没有子菜单消失的情况下离开并进入。即使消失也会刺激,并且如果菜单中有两个以上的级别,可能会导致沮丧。一个很好的延迟值可能会在300ms到500ms之间

来源:

1)jQuery的为 “慢” 与 “快” 的延迟值是600毫秒和200毫秒。

来源:http://api.jquery.com/delay/

2)博客文章谈到的200ms和500ms的之间的值。

来源:http://solvingdesign.com/archives/103

3)Sitepoint提到500毫秒在其关于大型下拉菜单的文章。

来源:http://www.sitepoint.com/make-a-mega-drop-down-menu-with-jquery/

4)微软窗口的默认延迟为400毫秒。

来源:http://www.youtube.com/watch?v=mLZFwQ2hPzc

结论

没有科学证据,但数字不言自明。

1

250〜300ms。 Windows用于其菜单的量。

+1

你有任何来源支持?不要试图听起来厚脸皮,真正感兴趣。 – alykhalid 2012-03-08 13:02:57

+0

根据诸如此短[youtube clip](http://www.youtube.com/watch?v=mLZFwQ2hPzc)这样的各种来源,windows菜单的默认延迟值为400毫秒。然而,有许多关于如何缩短延迟的搜索引擎结果。 – 2012-03-08 19:14:29