3

我在一个项目上设置了 CSS3 背景渐变,我想让它慢慢旋转。我只是从 CSS3 和 HTML5 开始(请注意,我使用 CSS 和 HTML 已经 15 年了,不过还有很多新东西)。是否可以只旋转背景,而不是实际元素?

(删除页面链接,因为它不再存在)它是背景渐变,即使它在文本的前景上,也必须喜欢背景剪辑);我不希望文本旋转,但我确实希望背景旋转。此外,这仅适用于 webkit 浏览器。

我愿意使用任何脚本来完成它——HTML5 画布、CSS3 转换、Javascript/jQuery 等(尽管保持纯 CSS3 会很棒)。但是,我试图避免使用任何图像。

4

1 回答 1

3

您可以通过使用 JavaScript 为 CSS 属性设置动画来做到这一点。这是一个使用一点 jQuery 来轻松更改 CSS 的示例:

演示:http: //jsfiddle.net/HYDAj/2/

基本上,我使用setInterval每 100 毫秒更改一次渐变角度。我无法让你的特定渐变工作,这个例子只适用于 WebKit 浏览器,但这会让你开始。

我还应该指出,WebKit 是唯一支持“背景剪辑:文本”的,所以这是它在 Firefox 或 IE 中不起作用的另一个原因。

如果您不想使用任何 jQuery,这里是纯 JavaScript 方式:

http://jsfiddle.net/HYDAj/3/

于 2012-04-20T21:58:40.103 回答