Что это такое?
Быстрая и лёгкая JavaScript-полифилл-библиотека, которая добавляет в браузеры без поддержки медиазапросов CSS3 с min/max-width — в первую очередь Internet Explorer 8 и старше — поддержку таких запросов, чтобы адаптивная вёрстка работала и там.
Быстрая и лёгкая JavaScript-полифилл-библиотека, которая добавляет в браузеры без поддержки медиазапросов CSS3 с min/max-width — в первую очередь Internet Explorer 8 и старше — поддержку таких запросов, чтобы адаптивная вёрстка работала и там.Это CSS-фреймворк или просто скрипт, который я подключаю к странице?Никакой не фреймворк — один небольшой скрипт (3 КБ в минифицированном виде, 1 КБ в сжатом gzipped) без зависимостей, разве что в комплекте идёт полифилл matchMedia. Браузеры, которые уже поддерживают медиазапросы, отсеиваются быстрой проверкой, так что скрипт фактически работает только там, где он нужен.
Никакой не фреймворк — один небольшой скрипт (3 КБ в минифицированном виде, 1 КБ в сжатом gzipped) без зависимостей, разве что в комплекте идёт полифилл matchMedia. Браузеры, которые уже поддерживают медиазапросы, отсеиваются быстрой проверкой, так что скрипт фактически работает только там, где он нужен.С чего начать, чтобы использовать его на своём сайте?Пишите медиазапросы с min/max-width в своём CSS как обычно, а затем подключайте respond.min.js после всего вашего CSS — чем раньше скрипт отработает, тем меньше шансов, что пользователи IE увидят вспышку неоформленного контента.
Пишите медиазапросы с min/max-width в своём CSS как обычно, а затем подключайте respond.min.js после всего вашего CSS — чем раньше скрипт отработает, тем меньше шансов, что пользователи IE увидят вспышку неоформленного контента.Он поддерживает любые медиазапросы?Поддержка намеренно узкая: обрабатываются только запросы min-width и max-width (для любых типов носителей). Вложенные медиазапросы не поддерживаются, а CSS, подключённый через @import или находящийся внутри элементов style, игнорируется.
Поддержка намеренно узкая: обрабатываются только запросы min-width и max-width (для любых типов носителей). Вложенные медиазапросы не поддерживаются, а CSS, подключённый через @import или находящийся внутри элементов style, игнорируется.Где он работает — в браузере, или мне нужно что-то на сервере?Полностью на стороне клиента, но он повторно запрашивает текст вашего CSS через Ajax, поэтому страницы должны отдаваться по HTTP (при file:// не работает), а стили с CDN или поддомена нужно проксировать локально, чтобы отдавать их старому IE.
Полностью на стороне клиента, но он повторно запрашивает текст вашего CSS через Ajax, поэтому страницы должны отдаваться по HTTP (при file:// не работает), а стили с CDN или поддомена нужно проксировать локально, чтобы отдавать их старому IE.Проект ещё поддерживается — стоит ли использовать его сегодня?Нет. Репозиторий заархивирован, а целевые браузеры (IE 6-8) давно устарели — все современные браузеры обрабатывают медиазапросы нативно. Относитесь к нему как к legacy-заплатке для очень старых кодовых баз, а не как к зависимости для новых проектов.
Нет. Репозиторий заархивирован, а целевые браузеры (IE 6-8) давно устарели — все современные браузеры обрабатывают медиазапросы нативно. Относитесь к нему как к legacy-заплатке для очень старых кодовых баз, а не как к зависимости для новых проектов.Почему ему нужно заново скачивать мой CSS?IE 8 и старше выбрасывают медиазапросы при разборе таблиц стилей, поэтому Respond.js загружает исходный CSS через Ajax, находит блоки с запросами с помощью регулярных выражений и вставляет их как элементы style, которые включает и отключает по мере изменения ширины окна.
IE 8 и старше выбрасывают медиазапросы при разборе таблиц стилей, поэтому Respond.js загружает исходный CSS через Ajax, находит блоки с запросами с помощью регулярных выражений и вставляет их как элементы style, которые включает и отключает по мере изменения ширины окна.Какие самые неприятные подводные камни стоит учитывать?Держите правила @font-face вне медиазапросов, иначе IE 7/8 зависнет при загрузке, не превышайте 32 таблицы стилей, иначе IE выдаст ошибку, избегайте кодировки UTF-8 с BOM, и имейте в виду, что комментарии с отладочной информацией Sass/SCSS ломают парсер.
Держите правила @font-face вне медиазапросов, иначе IE 7/8 зависнет при загрузке, не превышайте 32 таблицы стилей, иначе IE выдаст ошибку, избегайте кодировки UTF-8 с BOM, и имейте в виду, что комментарии с отладочной информацией Sass/SCSS ломают парсер.Он предоставляет какой-нибудь JavaScript API?Небольшой: respond.update() заново запускает парсер после того, как вы добавили таблицу стилей, respond.mediaQueriesSupported сообщает, обрабатывает ли браузер запросы нативно, а respond.getEmValue() возвращает значение одного em в пикселях.
Небольшой: respond.update() заново запускает парсер после того, как вы добавили таблицу стилей, respond.mediaQueriesSupported сообщает, обрабатывает ли браузер запросы нативно, а respond.getEmValue() возвращает значение одного em в пикселях.What are similar projects?fastclick, FileSaver.js, history.js, material, q, vue-resource, material-design-lite, jquery
fastclick, FileSaver.js, history.js, material, q, vue-resource, material-design-lite, jqueryWhich topics is it in?polyfill, legacy, cross-browser, responsive, javascript-library, deprecated, css, browser, utility, web-development, frontend, library
polyfill, legacy, cross-browser, responsive, javascript-library, deprecated, css, browser, utility, web-development, frontend, library