Опубликовано автор в категориях Верстальщику.


Здравствуйте. В очередной раз извиняюсь, что не писал уже больше недели. Так много хороших новостей произошло, а рассказать о них не вышло. Хотя, думаю тем, ко следит за событиями в мире веб-дизайна, и без меня известно, что недавно нас порадовали  прекрасные новости: вышел в свет релиз jQuery 1.4 и на пробу пользователей выставлена первая alpha Drupal 7. Но сегодня не об этом.

Сегодня я расскажу вам о прекрасном решении для того чтобы научить всеми нами горячо «любимые» браузеры семейства Internet Explorer понимать то, что все нормальные навигаторы уже давно знают, а именно специальные псевдо-селекторы CSS3, которые я лично уже давно использую в разработке. Согласитесь ведь куда удобнее, скажем, для первого элемента в списке прописать специальное свойство через специальный псевдо-селектор :first-child чем писать для этого сриптик, пусть и не большой, на JS. Собственно я часто использую подобные приемы для того чтобы, например убрать бордер у последнего или первого элемента и так далее. Для нормальных современных браузеров я писал современные правила, а для IE делал скрипт, который выбирал нужный элемент и присваивал ему нужный класс. Но теперь с этим покончено.

Покончено потому, что я узнал про ie-css3.js. Этот скрипт позволяет вам унифицировать работу браузеров IE5-8 с псевдо-селекторами CSS3. Для того чтобы браузер стал понимать нормальный человеческий язык стилей 🙂 ему стоить помочь включив в шапку вашего документа вызов следующих скриптов:

<head>
	<script type="text/javascript" src="DOMAssistantCompressed-2.7.4.js"></script>
	<script type="text/javascript" src="ie-css3.js"></script>
</head>

Почему два скрипта спросите вы? Потому, что ie-css3.js работает опираясь на DOMAssistant, разработанный Робертом Ниманом.

Помимо вызова скриптов в документе, вам следует придерживать еще нескольких рекомендаций для корректной работы скрипта:

  • CSS стили должны быть добавлены на страницу с помощью тега <link>. Стили вставленные непосредственно в страницу или прописанные инлайном не будут обрабатываться. Также можно использовать импорт таблиц стилей.
  • Таблицы стилей должен быть размещен на одном домене со страницей.
  • Таблицы стилей с использование file:// протокола не будут работать из-за ограничений безопасности браузера.
  • Псевдо-селектор :not() не поддерживается.
  • Эмуляция не является динамичной. После того, как стили были применены они остаются фиксированные в не зависимости от изменений DOM до перезагрузки дерева.

Поддерживаются следующие псевдо-селекторы:

  • :nth-child
  • :nth-last-child
  • :nth-of-type
  • :nth-last-of-type
  • :first-child
  • :last-child
  • :only-child
  • :first-of-type
  • :last-of-type
  • :only-of-type
  • :empty

P.S. Очередной набор мыслей не в тему…

Раз уж мы начали учить грамоте браузеры, то и самим не мешало бы поучиться, например изучение английского языка, как раз достойное занятие.

Ну а если учится не хочется совсем, то есть вариант. Аренда микроавтобуса Toyota Hiace для организации экскурсий по городу Санкт-Петербург. Тоже полезно и много интересного.

И в конце:

Спонсоры поста:
Скачать программы для мобильных телефонов можно на contmob.ru.

Завораживающие анимированные картинки для телефона бесплатно скачивают с mobilechest.ru.

3 комментария к записи “Учим Осла грамоте!”

    • hiway

      В том, что эти скрипты изначально ориентированы на разные задачи. Данный скрипт работает исключительно с псевдо-селекторами, даже не предусматривая работу с псевдоклассами, в то время как приведенный тобой скрипт дословно: «IE7 представляет собой библиотеку JavaScript, направленную на то, чтобы Microsoft Internet Explorer вел себя как соответствующий стандартам браузер. Он устраняет многие HTML и CSS вопросов и делает поддержку прозрачного PNG под IE5 и IE6». Заметь, здесь из известных CSS3 псевдо-селекторов не используется ничего кроме last-child и first-child. Это первичные из ряда псевдо-селекторов, поддержка которых присутствовала у «нормлаьных» браузеров еще когда даже не сущестовало IE7

      Ответить
  1. Константин

    Спасибо конечно, за предыдущий комментарий)
    З.Ы. Пожалуйста смените дизайн или уберите эти коды по бокам, они ужасно раздражают и отвлекают внимание!

    Ответить

Оставить комментарий

  • (не будет показан)