大佬教程收集整理的这篇文章主要介绍了jquery – 更改所选菜单选项卡的颜色,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
<script type='text/javascript' > $(document).ready(function () { $("div.content ul li a") .mouSEOver(function () { var t = $(this); if (!t.hasClass("clicked")) { // very easy to check if element has a set of styles t.addClass('mouSEOver'); } }) .mouSEOut(function () { // attach event here instead of inside mouse over $(this).removeClass('mouSEOver'); }); $("div.content ul li a").click(function () { var t = $(this); t.toggleClass("clicked"); if (t.hasClass("clicked")) { t.removeClass('mouSEOver'); } else { t.addClass('mouSEOver'); } }); }); </script>
我想要的最后一件事是在单击另一个选项卡时恢复标签正常css.
例如,当我点击tab1时,标签的bgcolors为白色.当我进入Tab2时,它变为黑色.Tab1变为白色,Tab2变为黑色
<ul> <li> <a href="#Tab1">Tab 1</a> </li> <li> <a href="#Tab2">Tab 2</a> </li> </ul>
让我们说这是CSS部分
ul li a {BACkground-color: white;} ul li a.mouSEOver {BACkground-color: black;} ul li a.mouSEOut {BACkground-olor: white;} ul li a.clicked {BACkground-color: black;}
<script type="text/javascript"> $(document).ready(function() { $("div.content ul li a") .mouSEOver(function() { $(this).addClass('mouSEOver'); }) .mouSEOut(function() { $(this).removeClass('mouSEOver'); }); $("div.content ul li a").click(function(E) { e.preventDefault(); //prevent the link from actually navigaTing somewhere $(this).toggleClass("clicked"); $("div.content ul li a").not(this).removeClass("clicked"); //remove the clicked class from all other elements }); }); </script>
这里的Javascript将执行以下操作:
>悬停链接时添加“鼠标悬停”类>当您不再悬停链接时,删除“mouSEOver”类>当您单击某个链接时,它将切换“已点击”类并将其从可能具有该类的任何其他链接中删除 – 这会将其他标签恢复为“正常”状态.
以上是大佬教程为你收集整理的jquery – 更改所选菜单选项卡的颜色全部内容,希望文章能够帮你解决jquery – 更改所选菜单选项卡的颜色所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。