Обнаружить поддержку нескольких фоновых изображений?

Question

Я действительно хочу использовать множественную фоновую поддержку (Webkit, Firefox 3.6+), но я хотел бы предоставить альтернативное решение для браузеров, которые его не поддерживают. (IE, Firefox 3.5 -).

Есть ли способ обнаружить поддержку этой функции CSS? Или мне придется прибегнуть к снифферу браузера?

РЕДАКТИРОВАТЬ: Добро пожаловать решения Javascript

Answer 1

Я знаю, что это довольно старый вопрос, но я подумал, что добавлю фрагмент JS, который можно использовать для его анализа. Код взят из источника Modernizr, но немного изменен:

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.

Answer 2

Нет, в чистом CSS нет способа обнаружить, поддерживается ли несколько фонов. Но вы можете указать фон по умолчанию, а затем указать несколько фонов, которые разрешают ошибку со значением обработки и сохраняют старый, если он не поддерживается.

Answer 3

Использование http://www.modernizr.com/. Это фрагмент javascript, который будет настраивать классы в зависимости от того, какие функции имеет браузер. Затем вы можете использовать эти классы в CSS.