Хорошая структура JavaScript, которая добавляет поддержку CSS3 в IE6-8 и отсутствует CSS3 в IE9?

Question

Я удивлен, что в версии IE9 отсутствует поддержка некоторых более базовых элементов CSS3, таких как text-shadow и border-image.

Какая самая полная JavaScript-среда для добавления / эмуляции элементов CSS3 в IE6-9 вместо использования нескольких небольших фреймворков, таких как ie-css3, CSS3PIE, Modernizr, html5shiv, ... и т. Д..

Answer 1

Что?Вы удивлены тем, что IE не соответствует стандартам?Когда люди будут учиться ...

Попробуйте Selectivizr .С веб-сайта: «selectivizr - это утилита JavaScript, которая эмулирует псевдоклассы CSS3 и селекторы атрибутов в Internet Explorer 6-8. Просто включите скрипт на своих страницах, а selectivizr сделает все остальное».Я не знаю, что такое поддержка IE9, но она должна быть намного проще, чем IE6, поэтому я думаю, что она должна работать нормально.

Вам все равно понадобятся некоторые из этих "меньших фреймворков", потому что они делают то, что онивсе в порядке, они достаточно малы, поэтому нет смысла изобретать велосипед просто ради того, чтобы иметь одну большую структуру вместо нескольких меньших.Трудно создать универсальный фреймворк, поэтому у вас есть некоторое разнообразие, и я думаю, что это хорошо.

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

Если вы хотите, чтобы расширенные эффекты работали согласованно во всех браузерах IE6, тогда я бы рекомендовал использовать Raphaël .Он использует VML в IE и SVG в других браузерах.API также проще, чем CSS, но это, конечно, дело вкуса.Но даже если не API, довольно сложно победить аргумент о том, что вы можете иметь закругленные углы и другие вкусности, которые выглядят одинаково на Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ и Internet Explorer 6.0+ без использованияизображения.

Answer 2

Элементы в вашем списке делают разные вещи.Я не думаю, что для одной единственной платформы имеет смысл реализовать все эти вещи.

Просто включите в свой список те, которые вам действительно нужны.

• Вы должны (очевидно) использовать html5shiv, только если вы используете элементы HTML5 на своей странице:

  <!--[if lt IE 9]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
  

• Modernizr имеет функциональность html5shiv плюс многообнаружение функций:

  Modernizr не добавляет отсутствующие функции в браузеры;вместо этого он обнаруживает встроенную доступность функций и предлагает вам способ поддерживать хороший уровень контроля над вашим сайтом независимо от возможностей браузера.

  Используйте html5shiv, если вы просто хотите стилизовать элементы HTML5 вIE.Используйте Modernizr, если вы хотите делать разные вещи в зависимости от того, поддерживаются ли определенные функции, например:

  .my_elem {
     border: 1px inset #666;
  }
  .borderimage .my_elem {
     border: none;
     border-image: url(fancy-border.png) 5 5 5 5 round;
     -moz-border-image: url(fancy-border.png) 5 5 5 5 round;
     -webkit-border-image: url(fancy-border.png) 5 5 5 5 round;
  }
  

• Идея, лежащая в основе CSS3PIE и Modernizr, очень отличается.

  Способ CSS3PIE чаще всего используется внутри CSS:

  #myElement {
      ...
      behavior: url(PIE.htc);
  }
  

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

  Принимая во внимание, что CSS3PIE пытается идеально эмулировать ограниченный набор свойств CSS3 для работы только в более старых версиях Internet Explorer, без дополнительной работы, кроме включения свойства behavior в соответствующих элементах.