失去css与jquery悬停 [英] losing css hover with jquery
本文介绍了失去css与jquery悬停的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
直到其中一个菜单项被点击，Css悬停才能正常工作。
我相信这个问题始于我添加了这一行
Css hover is working correctly until one of the menu items is clicked. I believe the problem started with I added this line
$("#buttons li a:not(a." + target + ")").css("background-position","0 0");
CSS
#buttons {float:left;}
#buttons ul {list-style-type:none;cursor:pointer;overflow:hidden;}
#buttons ul li {height:195px;width:40px;float:left}
#buttons a {display:block;height:195px;width:40px;border:none;cursor:pointer;}
#buttons a.settings:hover, #buttons a.duels:hover, #buttons a.messages:hover {background-position: -40px 0;}
#buttons a.settings {background:url(accountsettings.png)}
#buttons a.something {background:url(accountsomething.png)}
#buttons a.messages {background:url(accountmessages.png)}
#text{width:600px;height:199px;overflow:hidden;float:left;}
div#text div {width:600px;height:199px;float:left; margin-left:20px;}
HTML
<div id="buttons">
<ul>
<li><a class="settings"></a></li>
<li><a class="something"></a></li>
<li><a class="messages"></a></li>
</ul>
</div>
<div id="text">
<div id="settings">
<h2>Account Settings</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing</p>
</div>
<div id="something">
<h2>Something</h2>
<p>Lorem ipsum dolor sit amet, adipiscing elit. Nulla quam.</p>
</div>
<div id="messages">
<h2>Messages</h2>
<p>Lorem ipsum dolor sit amet, adipiscing elit. Nulla quam.</p>
</div>
</div>
