使用 jQuery 模拟悬停
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5169449/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Simulate Hover using jQuery
提问by Riccardo
Given the existing "buttons"
鉴于现有的“按钮”
HTML:
HTML：
<div id="MB">
<ul class="list">
<li id="post-5"><a href="#post-5">5</a></li>
<li id="post-4"><a href="#post-4">4</a></li>
<li id="post-3"><a href="#post-3">3</a></li>
<li id="post-2"><a href="#post-2">2</a></li>
<li id="post-1"><a href="#post-1">1</a></li>
</ul>
</div>
CSS:
CSS：
#MB .list li a {
float:left;
color:#333;
background:#f6f6f6;
border:1px solid #eaeaea;
border-right:none;
padding:0 8px;
}
#MB .list li a:hover,
#MB .list li a:focus {
color:#fff;
border:1px solid #333333;
border-right:none;
background:#404040;
text-decoration:none;
}
I'd like to simulate "hover" automatically on each button, sequentially, every n seconds.
我想在每个按钮上自动模拟“悬停”，顺序，每 n 秒。
This means that every n seconds a button is "hovered" (changing color etc), at next interval is "turned off" and the following button will "turn on" and so on...
这意味着每 n 秒一个按钮“悬停”（改变颜色等），在下一个时间间隔“关闭”并且接下来的按钮将“打开”等等......
采纳答案by roryf
#MB .list a:hover,
#MB .list a:focus,
#MB .list .active a {
/* hover styles */
}
(I've simplified your selectors a bit, I would also suggest trying to remove the outer divas these are often unnecessary and the ulalone is enough)
（我已经稍微简化了您的选择器，我还建议尝试删除外部，div因为这些通常是不必要的，而ul单独就足够了）
Javascript hover:
Javascript悬停：
function setHover() {
if ($('#MB .list .active').next().length) {
$('#MB .list .active').next().addClass('active').end().removeClass('active');
} else {
$('#MB .list .active').removeClass('active');
$('#MB .list li:first-child').addClass('active');
}
}
setInterval(setHover, 1000);
回答by kojiro
I would use setIntervaland jQuery.trigger('mouseover', …).
回答by fforw
Define a third selector like
定义第三个选择器，如
#MB .list li a:hover,#MB .list li a:focus,#MB .list li a.simFocus { … }
#MB .list li a:hover,#MB .list li a:focus,#MB .list li a.simFocus { ... }
and then add and remove the "simFocus" class time-based per javascript code.
然后添加和删除每个 javascript 代码基于时间的“simFocus”类。
回答by user2212713
Try adding onClick="return true" in your link a href tag
尝试在您的链接中添加 onClick="return true" href 标签
<a href="../about.php" onMouseOver="mopen('m2')" onMouseOut="mclosetime()" onClick="return true">About us</a>
the onClick="return true" should simulate a cursor hovering over then leaving the hover area. effectivly giving you a hover effect.
onClick="return true" 应该模拟光标悬停然后离开悬停区域。有效地为您提供悬停效果。
keep in mind, ur finger has to touch the button for the hover effect to take place, which means the user will only see the change for a second or two before the link loads a page.
请记住，您的手指必须触摸按钮才能发生悬停效果，这意味着用户只会在链接加载页面之前看到更改一两秒钟。
