代码之家 › 专栏 › 技术社区 › jessegavin

检测是否支持多个背景图像?

cross-browser css javascript

1

jessegavin · 技术社区 · 15 年前

我真的想利用多个后台支持(Webkit、Firefox 3.6+),但是我想为不支持它的浏览器提供一个替代解决方案。(例如,火狐3.5-)。

有没有什么方法可以检测到对这个CSS功能的支持?或者我必须借助浏览器嗅探?

编辑: 欢迎使用JavaScript解决方案

3 回复 | 直到 14 年前

1

2

liori 15 年前

使用 http://www.modernizr.com/ . 这是一段javascript,它将根据浏览器的功能设置类。然后可以在CSS中使用这些类。

2

5

betamax 14 年前

我知道这是一个相对古老的问题,但我想我应该添加一个JS片段,可以用来嗅探这个问题。代码是从现代化的源代码中提取的,但有一点修改过:

function multipleBgTest(){

  var el_style = document.createElement("div").style;
  el_style.cssText = 'background:url(//:),url(//:),red url(//:)';

  // If the UA supports multiple backgrounds, there should be three occurrences
  // of the string "url(" in the return value for el_style.background
  return new RegExp("(url\\s*\\(.*?){3}").test(el_style.background);

}

如果函数返回 true 然后它被支持,否则它将返回 false .

3

2

kravemir 15 年前

不,纯CSS中没有检测是否支持多个背景的方法。但您可以指定默认背景,然后指定多个背景,这些背景使用处理值解决错误,如果不支持,则保持旧的背景。