jQuery悬停没有动画但有延迟

Question

我遇到了jQuery或jQuery UI的问题。我想在悬停时为按钮设置动画，但不是平滑地设置动画，而是等待指定的时间，然后立即弹出更改。有什么建议吗？

当我放大Chrome时，似乎这个变化分为两个步骤。也许是因为它没有太大的变化，所以它以这种方式处理它？<​​/ p>

$(".btn-form").hover(
        function() {
            $(this).stop().animate(
            {
                borderWidth : "2px",
                borderColor : "#B27332"
            }, 500);
        },
        function() {
            $(this).stop().animate(
            {
                borderWidth : "1px",
                borderColor : "gray"
            }, 500);
        });

Answer 1

您的代码有效！不幸的是，以平滑的方式从1px到2px的边界变化是不可想象的。

您也可以尝试使用CSS转换获得相同的结果。

.btn-form {
border: 1px solid gray;
transition: border 500ms;
}

.btn-form:hover {
border: 2px solid #B27332;
}