实例见锐意先行《手机test》中《手机test5》。
针对a写两段样式:
.nav_ul > li > a {
display: block;
background: url(‘images/down.png‘) no-repeat scroll right center transparent;
padding: 10px 0px;
border-bottom: 1px solid #E2E2E2;
color: #000;
font-size: 1.5em;
transition: all 0.4s ease 0s;
}
/*点击前的color是#000;*/
.nav_ul > li > a.color{
color: #E60012;
}
/*点击后的color是#E60012;*/
JS代码:
<script type="text/javascript">
$(document).ready(function(){
$(‘#js_nav_ul li a‘).click(function(){
$(‘#js_nav_ul li > a‘).removeClass(‘color‘);
$(this).addClass(‘color‘);
});
});
</script>
//removeClass() 方法从被选元素移除一个或多个类。
addClass() 方法向被选元素添加一个或多个类。
该方法不会移除已存在的 class 属性,仅仅添加一个或多个 class 属性。
提示:如需添加多个类,请使用空格分隔类名。
代码先写removeClass() ,去掉原先的样式color: #000;
后写addClass(),追加新样式 color: #E60012;。