解决pc端选中效果
Posted 安心牧羊人
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了解决pc端选中效果相关的知识，希望对你有一定的参考价值。
<style>
*{ margin:0; padding:0; list-style:none;}
body{ font:normal 14px/24px ‘MicroSoft YaHei‘;}
.cotrs{ width:960px; height:32px; line-height:32px; background:#999; margin:0 auto;}
.cotrs a{ height:32px; line-height:32px; color:#fff; text-decoration:none; padding:0px 10px; display:block; float:left;}
.cotrs a:hover{ text-decoration:none; background:#000;}
.cotrs a.thisclass{text-decoration:none; background:#000;}
</style>
<body>
<div class="cotrs">
<a href=‘javascript:‘ class="thisclass">菜单一</a>
<a href=‘javascript:‘>菜单二</a>
<a href=‘javascript:‘>菜单三</a>
<a href=‘javascript:‘>菜单四</a>
<a href=‘javascript:‘>菜单五</a>
</div>
</body>
<script>
$(function(){
var cotrs = $(".cotrs a");
cotrs.click(function(){
$(this).addClass("thisclass").siblings().removeClass("thisclass");
});
});
</script>
以上是关于解决pc端选中效果的主要内容，如果未能解决你的问题，请参考以下文章
[教你做小游戏] 滑动选中！PC端+移动端适配！完美用户体验！斗地主手牌交互示范