jQuery CSS3渐变插件

Question

有没有人知道一个支持跨浏览器渐变的jquery css3插件？到目前为止，我看到的所有渐变插件都是基于创建许多元素的。谢谢。

编辑：抱歉表述不清，我不是试图让CSS3在不支持它的浏览器上工作。我知道我可以在支持CSS3渐变的浏览器上使用渐变，并使用IE过滤器。我想知道是否有人已经编写了一个jQuery插件，这样我就可以在代码中实现它。

例如，jQuery核心标准化了 elem.css('opacity', '.5') ，以便它可以跨浏览器工作，而不管不同的语法。也在寻找类似于此的渐变插件。

但如果它不存在，我想我只能自己写了。

- Mark

---

CSS3支持渐变，您不需要jQuery插件来实现。问题在于并非所有浏览器都实现了CSS3。 - RaYell

@RaYell，我想做类似于这样的事情：elem.css(gradient(#000).to(#fff));，但不想手动编写所有的 CSS，因为这相当繁琐。 - Mark

Answer 1

嗯嗯，派。

CSS3PIE - Progressive Internet Explorer - makes Internet Explorer 6-8 capable
of rendering several of the most useful CSS3 decoration features.

这个.htc非常容易实现和使用。

- FelipeAls

Answer 2

创建渐变的唯一跨浏览器方法是创建具有不同背景颜色的元素。可以使用3个规则（每个渐变）支持moz，webkit和IE浏览器：

/* IE */
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#ffffff00,endColorstr=#00000000);
/* webkit(Safari, Chrome) */
-webkit-gradient(linear,left bottom,right bottom,color-stop(1, rgb(0,0,0)),color-stop(0, rgb(255,255,255)));
/* mozilla(Firefox) */
-moz-linear-gradient(left center,rgb(0,0,0) 100%,rgb(255,255,255) 0%);

然后你可以使用普通的背景颜色作为备选方案。

- tcooc

Answer 3

创建许多元素是在不想使用图像时获得跨浏览器渐变的唯一方法 - 而且 jQuery 无法动态创建图像。使用其中一个（糟糕的？）插件或简单地使用 Photoshop（或 GIMP（或 Paint））创建您的渐变。

我最喜欢的是：为好的、现代的浏览器（新版 Safari / Firefox、Internet Explorer）支持渐变，并为差的浏览器（旧版 Safari / Firefox）使用普通的背景颜色作为回退。

注意：在这种情况下，IE 是好的浏览器之一，它自始至终都支持渐变。

- oezi

Answer 4

虽然不是特别针对jQuery，但使用Raphael（JavaScript图形库）可以设置跨浏览器渐变。请参见http://raphaeljs.com/reference.html#attr下的设置。

注意：这是一个矢量图形库实现，根据浏览器使用不同的技术来实现其效果。

- ScottS

Answer 5

如果你觉得编写CSS3渐变很困难，可以尝试使用CSS3渐变生成器。你可以在这里找到一份渐变列表。

- GILL

Answer 6

今天你可以使用cssHooks来实现跨浏览器的jquery渐变效果。

- Mark