Javascript 在导航栏中切换文本光晕？_Javascript_Jquery_Toggle_Navbar_Glow

Javascript 在导航栏中切换文本光晕？

javascript jquery

Javascript 在导航栏中切换文本光晕？,javascript,jquery,toggle,navbar,glow,Javascript,Jquery,Toggle,Navbar,Glow,大家好，这里是新手。我尽了最大努力通过搜索找到一个简单的解决方案，但我没有发现任何适合我的方法。我的网站使用一个隐藏/显示div的导航栏来“更改页面”（所有内容都包含在一个HTML文件中），而目前还没有这些项目中哪一项是当前页面的可视指示器。我如何使其在单击菜单项时，在该项上启用文本发光效果（我假定为CSS3效果），并关闭所有其他菜单项上的文本发光？谢谢你的帮助您需要javascript来实现这一点。您可以有2个css类。单击菜单项时，类名将更改。这将使用Jquery使其变得简单。祝你好运 J

大家好，这里是新手。我尽了最大努力通过搜索找到一个简单的解决方案，但我没有发现任何适合我的方法。我的网站使用一个隐藏/显示div的导航栏来“更改页面”（所有内容都包含在一个HTML文件中），而目前还没有这些项目中哪一项是当前页面的可视指示器。我如何使其在单击菜单项时，在该项上启用文本发光效果（我假定为CSS3效果），并关闭所有其他菜单项上的文本发光？谢谢你的帮助

您需要javascript来实现这一点。您可以有2个css类。单击菜单项时，类名将更改。这将使用Jquery使其变得简单。祝你好运

JsFiddle：

HTML:

CSS:

这有很多要回答的问题，你有任何例子或链接吗？如果没有，你可能想试试这样的方法：嘿，我知道这个问题已经有一年了，但我意识到我忘了把这个答案标记为正确的，因为我最终使用了这个。实际上，我进一步简化了它，为每个列表项提供了相同的类，因此当调用该函数时，它会从每个项中删除“活动”类，然后将其应用于单击的项<代码>函数glow1（）{$（'.list item'）。removeClass（'activeClass'）；$（'list-item-1'）。addClass（'activeClass'）；}

 <html>
<head>
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <link rel="stylesheet" type="text/css" href="StyleSheet.css">
    <title></title>
</head>
<body>
    <p id="Test1" onclick="glow1()">ITEM ONE</p>
    <p id="Test2" onclick="glow2()">ITEM TWO</p>
    <p id="Test3" onclick="glow3()">ITEM THREE</p>
</body>
</html>

function glow1() {

        $('#Test1').addClass('class1');
        $('#Test2').removeClass('class1');
        $('#Test3').removeClass('class1');
        }



    function glow2() {


        $('#Test2').addClass('class1');
        $('#Test1').removeClass('class1');
        $('#Test3').removeClass('class1');
        }

    function glow3() {

        $('#Test3').addClass('class1');
        $('#Test1').removeClass('class1');
        $('#Test2').removeClass('class1');
        }

 .class1 {
    text-shadow: 0 0 12px #ff0000
}