Question

我试图让我的导航元素在文档滚动时改变颜色，我也想让动态悬停状态改变颜色。但是有一个延迟，我必须等待几分钟才能悬停并改变颜色。我可以删除延迟吗？或者更好的是，当我在菜单上徘徊时，我可以通过滚动来改变悬停的颜色吗？我觉得我已经非常接近解决方案，但我无法找到它。

以下是jQuery代码：

$(document).ready(function () {
    $(document).scroll(function () {
        var h = $(window).scrollTop() / $(document).height() * 360;
        if (h <= 180) {
            hhover = h + 180;
        } else {
            hhover = h - 180;
        }
        $("a").css({
            "color":"hsl(" + h + ",100%,50%)","transition":"0.2s ease"});
        $("a").hover(
        function () {
            $(this).css(
                "color", "hsl(" + hhover + ",100%,50%)");
        },
        function () {
            $(this).css(
                "color", "hsl(" + h + ",100%,50%)");
        });
    });
});

请在下面找到我的jsFiddle： https://jsfiddle.net/dtZDZ/1036/

谢谢！

Answer 1

在您的CSS代码中：

.nav-links a:hover {
    color: hsl(180,100%,50%);
    transition: ease;
}

Answer 2

从javascript代码和样式中删除所有CSS转换定义。

如何删除jQuery .hover（）方法中的延迟

2 个答案: