这应该很简单,但我无法让它工作
我的列表
<div id="ctMenu"> <ul> <li><a href="#">WELCOME</a></li> <li><a href="#">ABOUT US</a></li> <li><a href="#">CONTACT</a></li> </ul></div>
我的CSS
#ctMenu { width:1010px; margin: 20px 0 0 0; padding:20px 0 20px 0} #ctMenu ul { margin:0; padding:0;} #ctMenu ul li { margin-left: 0; margin-bottom:0; display:inline;} #ctMenu ul li a { padding: 10px 25px 9px 25px; background-color:green; text-decoration: none; color:Black; font-weight:bold; } #ctMenu ul li a:hover {background-color:Gray; } .selected { background-color: yellow; }
我的jQuery
$(document).ready(function () { $('#ctMenu ul li a').click(function () { $('#ctMenu ul li a').removeClass('selected'); $(this).addClass('selected'); }); });
当有人点击链接时,我只是想把css设置为“.selected”类.有什么建议?
解决方法
问题是你声明了一个更强的CSS规则#ctMenu ul li a覆盖了.selected.请尝试使用此CSS规则:
#ctMenu ul li a.selected { background-color: yellow; }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。