您的位置：首页 > Web前端 > JQuery

Jquery鼠标点击后变色，点击另一个按钮颜色还原

2017-02-17 01:44 567 查看
 


Jquery鼠标点击后变色，点击另一个按钮颜色还原

标签： jqueryhtmlJquery鼠标点击后变色点击另一个按钮颜色还原
2015-12-25 17:46 3291人阅读 评论(0) 收藏 举报

转载一个！


Jquery鼠标点击后变色，点击另一个按钮颜色还原

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

<script type="text/javascript">

$(function(){

  $("#nav li").click(function(){

    $("#nav li").eq($(this).index()).addClass("navdown").siblings().removeClass("navdown");

  })

})

</script>

<style>

a{text-decoration:none; color:#666666;}

#nav ul{ list-style:none; float:left; text-align:right; margin-top: 18px; line-height: 42px; margin-left: -2px;}

#nav ul li{ font-family:"微软雅黑","宋体"; font-size:14px; font-style:normal; font-weight:bold; letter-spacing:4px;}

#nav ul li a:hover{ color:#666666;border:1px solid #F00;}

.navdown a{color:#ff0000; border:1px solid #F00;}

</style>

<body>

   <div id="nav">

      <ul>

  <li class="navdown"><a href="#"><span>网站首页</span></a></li>

          <li><a href="#"><span>关于我们</span></a></li>

  <li><a href="#"><span>新闻资讯</span></a></li>

  <li><a href="#"><span>产品展示</span></a></li>

  <li><a href="#"><span>客户案列</span></a></li>

  <li><a href="#"><span>联系我们</span></a></li>

  </ul>

   </div>

</body>
原文链接：http://www.qdonger.com/article-638-1.html
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航