Css3-mediaqueries.js VS response.js

reply.js или css3-mediaqueries.js?

Официальная документация, особенно версия css3-mediaqueries.js, разрежена. Чтение на SO, форумах и блоги Я обобщил эти плюсы и минусы.

respond.js

Плюсы:

  • Более надежный (рекомендуется Modernizr, Twitter Bootstrap 3 и H5BP)
  • Зажигалка (4kb) и быстрее
  • Интерпретировать mediaquery в любом контексте (<link>, встроенный CSS, @import-ed CSS)

Минусы:

  • Не обновляется при изменении размера окна
  • Поддерживает только min-width и max-width
  • Не поддерживает em единицы (огромная слабая точка!)

CSS3-mediaqueries.js

Плюсы:

  • Реагирует в реальном времени (при изменении размера тоже!)
  • Поддерживает em единицы (действительно, кто-нибудь его протестировал?)

Минусы:

  • Тяжелый (15kb) и медленный
  • Интерпретировать только встроенный CSS с явно объявленным медиа-типом
  • Отсутствует подробная документация, и проект кажется заброшенным

Есть ли у кого-нибудь баллы для добавления в список или личный опыт для совместного использования или для конкретного предпочтения для одного или другого script? Если да, то почему?

Ответы

Ответ 1

Я создал тестовую страницу, включая Mediatizr.

Если кому-то интересно, здесь тестовая страница, и это results (протестирован на IE8 и IE7).

CSS3-mediaqueries.js

Pros

  • Поддерживает min, max и min+max mediaqueries
  • Поддерживает px и em значения
  • Реагирует на изменение размера окна
  • Разрабатывает CSS на странице (<style>) и внешние таблицы стилей

Против

  • Не поддерживает width mediaquery
  • Не разрабатывает <link media="screen and ..."> и @import ed stylesheet

respond.js

Pros

  • Поддерживает min, max и min+max mediaqueries
  • Поддерживает px и em значения
  • Реагирует на изменение размера окна
  • Выполняет только внешние таблицы стилей

Против

  • Не поддерживает width mediaquery
  • Не разрабатывает CSS на странице, <link media="screen and ..."> и @import ed stylesheets
  • Это может привести к ошибке javascript в сочетании с событиями jQuery on load, для его решения вам необходимо поместить script в конец страницы

mediatizr.js

Просто... не работает

В конце я выбрал css-mediaqueries.js, условно загруженный Modernizr.

Ответ 2

Теперь, наверное, дело сейчас. Я разработал чистую структуру Javascript, которая генерирует и управляет медиа-запросами. Он работает со всеми браузерами и операционными системами. Он занимает менее 500 символов. Вы можете видеть, как он работает здесь: ieee-ac.org.