使用Modernizr填充CSS过渡

Question

作为HTML5样板的一部分，我安装了modernizr js，但我不知道如何使用它。我创建了一个带有一些过渡的CSS3导航。我知道IE不支持它们，但据我所知，现代可以使用js进行polyfill。是那么回事吗？我该怎么做？我不太了解js。

my jsfiddle

Answer 1

您需要添加yepnope脚本来检查是否支持css3转换。例如：

yepnope({
  test : Modernizr.transition,
  yep  : '',
  nope : ['polyfillfortransition.js']
});

更新

实际上，如果你使用jQuery，有一个插件可以做到这一点。你不需要做上面的代码。Addy Osmani的这篇文章将更好地解释http://addyosmani.com/blog/css3transitions-jquery/。在那篇文章中，他还解释了yepnope的用法。

Answer 2

Modernizr没有为CSS3特性提供任何多边形填充。它确实提供了一个简单的polyfill来支持旧浏览器中HTML5元素的样式。除此之外，它主要用作通过将类名添加到页面的html标记来检测功能的方法。

所以在你的css中，你可以这样做

.borderradius .mydiv {
    border-radius: 8px;
}

如果你的浏览器支持it...or，你可以在你的js中使用它来有选择地退回到插件和类似的东西。