Question

大家好，新手在这里。我已经尽力通过搜索找到一个简单的解决方案，但我没有遇到任何适合我的方法。我的网站使用隐藏/显示div的导航栏来“更改页面”（全部包含在一个HTML文件中），目前没有可视指示符显示这些项目中的哪一个是当前页面。如何制作它，以便在单击菜单项时，在该项目上启用文本发光效果（CSS3效果，我会假设）并且所有其他菜单项上的文本发光都会关闭？谢谢你的帮助！

Answer 1

JsFiddle：http://jsfiddle.net/usd6v5kp/1/

HTML：

 <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>

JQuery的：

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');
        }

CSS：

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

Answer 2

你需要javascript。你可以有2个CSS课程。单击菜单项时，类名更改。这使用Jquery来简化。祝好运。 See more

在导航栏中切换文字发光？

2 个答案: