0

我试图让这个脚本在 FireFox 中工作,它似乎只想在 Chrome 中工作。我猜这是由于 webkit,所以我尝试将其转换为标准渐变,但它根本不起作用。脚本有什么问题?

网络套件:

var grad = '-webkit-gradient(linear, left top, right top, color-stop(0, transparent), color-stop(1, #' + color + '))';

标准:

var grad = 'linear-gradient(to left, color-stop(0, #' + color + '), color-stop(1, transparent))';

实时脚本:http: //jsfiddle.net/LThhd/12/

4

3 回答 3

1

-moz-linear-gradient 是 Firefox 中渐变的正确名称

CSS 渐变创建的有用工具:http: //www.colorzilla.com/gradient-editor/

于 2012-10-15T14:11:13.233 回答
1

您需要使用-moz前缀使其在 Firefox 中工作。为了完全兼容浏览器,建议使用以下所有 CSS 规则(显然,根据需要替换颜色):

background-color: #444444;
background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999));
background-image: -webkit-linear-gradient(top, #444444, #999999);
background-image:    -moz-linear-gradient(top, #444444, #999999);
background-image:      -o-linear-gradient(top, #444444, #999999);
background-image:         linear-gradient(to bottom, #444444, #999999);

按顺序,它们针对以下浏览器:

  1. 不支持渐变的旧浏览器
  2. Safari 4.*、5.0 和旧版 Chrome
  3. Chrome 10+、Safari 5.1+、iOS 5+
  4. 火狐 3.6-15
  5. 歌剧 11.10-12.00
  6. 火狐 16+、IE10、Opera 12.50+

(来源:http ://css3please.com )

于 2012-10-15T14:45:16.850 回答
0

您不必使用 -moz- 前缀 .... http://webdesignerwall.com/tutorials/cross-browser-css-gradient

于 2012-10-15T14:10:36.133 回答