码迷,mamicode.com
首页 > 其他好文 > 详细

jqmobi 子菜单 高亮效果

时间:2014-11-10 15:09:50      阅读:133      评论:0      收藏:0      [点我收藏+]

标签:style   blog   io   color   ar   java   sp   div   on   

在jqmobi 中经常用到一个 子菜单 单击某一个选项 希望能高亮;所以我是这样做的
1.HTML的页面显示是这样的

1           <div class="order_subheader01" id="list_onclick">
2             <li class="activeli"><a href="" >默认</a></li>
3             <li><a href="">新品</a></li>
4             <li><a href="">推荐</a></li>
5             <li><a href="">价格</a></li>
6             </div>

 


2.当点击是,处理的效果 函数如下

$("#list_onclick>li").on(‘click‘, function(event) {
    event.preventDefault();
    /* Act on the event */
     $("#list_onclick > li").not(event.currentTarget).removeClass("activeli");
     $(event.currentTarget).addClass("activeli"); 
});

  


3.其中的CSS是这样的

/*商品列表 子菜单 按下时 li a 的CSS*/
.activeli a{
	  color: rgb(193,35,135) !important;
}
.activeli{
		border-bottom: rgb(193,35,135) solid 1px !important;
}

  

jqmobi 子菜单 高亮效果

标签:style   blog   io   color   ar   java   sp   div   on   

原文地址:http://www.cnblogs.com/xieyier/p/4087042.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!