javascript - 如何消除 jQuery .hover() 方法中的延迟

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