jquery addclass 加不上属性

最新推荐文章于 2024-07-30 20:19:19 发布

Shine

最新推荐文章于 2024-07-30 20:19:19 发布

阅读量360

点赞数

分类专栏： Jquery+DIV

Jquery+DIV 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

jquery addclass 加不上属性

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml" dir="ltr" lang="en-EN">
<head>
<script src="js/jquery-1.2.1.min.js" type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
$(document).ready(function () {
$('#menu ul').hide();
$('#menu ul:first').show();
$('#menu li ul li').click(function() {
$(this).find('a').each(function(i) {
if (i == 0) {
$('#menu li ul li a').removeClass("accordionPitchOnLine");
$(this).addClass("accordionPitchOnLine");
}
});
});
$('#menu li a').click(
function() {
var checkElement = $(this).next();
if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
$('#menu ul:visible').slideUp('normal');
return false;
}
if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
$('#menu ul:visible').slideUp('normal');
checkElement.slideDown('normal');
return false;
}
}
);
});
</script>
<style type="text/css">
p {
line-height: 1.5em;
}
ul#menu, ul#menu ul {
list-style-type:none;
margin: 0;
padding: 0;/*离左边的长度*/
width: 15em;/*长度*/
}
ul#menu a {
display: block;
text-decoration: none;
}
ul#menu li {
margin-top: 1px;/*每层之间的距离*/
}
ul#menu li a {
background: #fff;/*div颜色就是鼠标没经过时*/
color: #000;/*没选中时字体颜色*/
padding: 0.5em;
font-weight: bold;/*粗体*/
}
ul#menu li a:hover {
background: #CCCCCC;/*鼠标经过时的颜色*/
}
ul#menu li ul li a {
background: #fff;/*li的颜色*/
color: #888;/*标签里的字体颜色*/
padding-left: 40px;/*距离左边的距离*/
font-size: 15px;
}
ul#menu li ul li a:hover {/*移过去时候有黑色小正方形*/
background: #f6f6f6;/*鼠标移过去时背景颜色*/
border-left: 5px #000 solid;/*移过去时候有黑色小正方形颜色*/
padding-left: 15px;/*移过去时字体位置*/
font-weight: bold;/*粗体*/
}
.accordionPitchOnLine {
background: #f6f6f6;
border-left: 5px #000 solid;
padding-left: 15px;
font-weight: bold;
}
</style>
<title> http://www.yuanmaying.com/</title></head>
<body>
<h1>简洁的JQuery竖导航菜单</h1>
<ul id="menu">
<li>
<a href="#">Cool Stuff</a>
<ul>
<li><a href="#">Apple</a></li>
<li><a href="#">niutuku</a></li>
<li><a href="#">XBOX360</a></li>
<li><a href="#">niutuku</a></li>
<li><a href="#">Nintendo</a></li>
</ul>
</li>
<li>
<a href="#">Search Engines</a>
<ul>
<li><a href="#">Yahoo!</a></li>
<li><a href="#">Google</a></li>
<li><a href="#">Ask.com</a></li>
<li><a href="#">Live Search</a></li>
</ul>
</li>
</ul>
<p></p>
</body>
</html>
我想要当点击之后 background: #f6f6f6;
border-left: 5px #000 solid;
padding-left: 15px;
font-weight: bold;吧这几个属性加上去，为什么只加上了border-left: 5px #000 solid;如何解决？却又不影响效果。

满意答案

采纳率：25.5% 满意答案：0
标签： php asp html
宣言：我们不是高手，但我们都会认真回答每一…

网页起航中级团合作回答者：1人 2012-02-02

这样写： ul#menu li ul li .accordionPitchOnLine {
background: #f6f6f6;
border-left: 5px #000 solid;
padding-left: 15px;
font-weight: bold;
}

注意css的优先顺序

追问：

你太利害了为什么我上面的却加不上去，加了你的就加上去了呢？难道我那样写加CLASS是不正确的？

+1 已赞过 5

你、莪的乖乖的感言：太感谢您了，兄弟你救了我的命啊，不然就要被老板叼了。。 2012-02-02