Question

我有一个项目，其中不同的客户有自己的主题（html颜色代码保存在sql数据库中）。一旦他们登录我改变主题（菜单和页脚颜色）。因此，主题本身保持一致，只有颜色在变化。

在我的母版页面中，我添加了一些js代码来自动更改，具体取决于登录的人。悬停和移出菜单项工作正常。如果不将鼠标悬停在活动菜单项上，则设置活动菜单项也可以。如果将鼠标悬停在活动菜单项上，则会从活动菜单项中删除该样式。

这就是我所做的：

    $('.navigation').css({ "background": "#" + primaryColor });
        $('.navigation ul li a').css({ "color": "#" + primaryTextColor });

        $(".navigation ul li a").hover(function () {
            $(this).css({ "background": "#" + secondaryColor, "color": "#" + secondaryTextColor });
        }).mouseout(function () {
            $(this).css({ "background": "#" + primaryColor, "color": "#" + primaryTextColor });
        });

    id = (function () {
            return f = window.location.href.split('/').pop().split('.')[0];
        })

    $("#mi" + id()).css({ "background": "#" + secondaryColor, "color": "#" + secondaryTextColor });

菜单项以这种方式构建：

    <div class="navigation">            
        <ul id="liHome" runat="server" >
            <li id="miDefault" ><a href="../Default.aspx">Home</a></li>
            <li id="miScanDocuments" ><a href="ScanDocuments.aspx">Scan Document</a></li>
            <li id="miViewDocument" ><a href="ViewDocument.aspx">View Document</a></li>
        </ul>
        <div class="cl">&nbsp;</div>
    </div>

我认为在mouseout事件中删除了样式。如果当前页面是活动菜单项，有什么方法可以阻止删除样式吗？

Answer 1

您可以在:not() $(".navigation ul li a")中使用$(".navigation ul li a:(.current)") CSS伪类，当然您需要事先添加该类，以便更新您的ID函数添加＆＃39;当前＆＃39;作为你的第一个功能。即只是绑定到你想要的元素，所以当你将鼠标悬停在当前菜单项上时它不应该运行。

不要删除悬停在菜单项上的活动类样式

1 个答案: