使用CSS过渡和jQuery动画

Question

我正在尝试CSS转换和jQuery UI功能。在我回答我的问题之前，请查看以下演示。

1. 鼠标悬停在this页面中的链接时显示的效果是使用仅 CSS过渡完成的。

2. 在this页面中，我使用 only jQuery创建了相同的效果（注释了CSS转换规则）。

3. Here，我只保留了CSS和jQuery代码，并注意到由于在CSS和jQuery中触发了两个事件而导致动画有相当大的延迟（我认为< / em>的）。

现在我的问题是我如何保留它们并在用户的浏览器中有效地使用一种方法？例如，

• 当用户打开页面并且他的浏览器有JavaScript时 已禁用，它会运行CSS方法。
• 如果用户的浏览器不支持CSS转换，则运行 JavaScript方法。

我怎样才能做到这一点？

编辑：：我读到了有关Modernizer的信息，但如果在用户的浏览器中停用了JavaScript，则效果不会很好。

Answer 1

您考虑过使用Modernizr吗？

if(!Modernizr.csstransitions) { // Test if CSS transitions are supported
            $(function() {
                //animate
            });
        }