—»     —»   jQuery-плагин для оптимального использования пространства экрана
  Раздел: Java-Скрипты   Нет комментариев  

jQuery-плагин для оптимального использования пространства экрана



Оптимизация использования экранного пространства – это, можно сказать, ключевой аспект хорошего веб-дизайна, а адаптивного веб-дизайна – особенно.

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

Если вы занимаетесь обновлением адаптивного дизайна сайта, то вам наверняка «посчастливится» столкнуться с проблемой расстановки контента динамическим образом, в зависимости от размера экрана устройства, которое использует пользователь. Автоматическая расстановка контента имеет значение, так как это экономит время, затрачиваемое на создание breakpoint’ов для каждой страницы и каждого элемента.

Веб-сайт с постоянно меняющимся контентом (вроде блога или онлайн-магазина) может извлечь невероятное преимущество из автоматической расстановки. В конце концов, хотелось бы вам копаться в коде сайта вашего клиента в попытках выставить breakpoint’ы и наладить разметку, если клиенту вдруг вздумается написать большую по объему статью?

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

javascript (включая jQuery и другие библиотеки) – это наиболее распространенный способы создания такого типа разметки, хотя бы потому, что эта технология работает во всех браузерах. Именно благодаря данной технологии работают vGrid, Wookmark и Masonry.

Freetile.js представляет собой свежий jQuery-плагин, который позволяет нам создавать динамически организованную разметку данного типа. Он был использован в качестве движка Assemblage и Assemblage Plus на протяжении почти двух лет, и теперь доступен как отдельный проект с открытым исходным кодом.

jQuery-плагин для оптимального использования пространства экрана

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

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

Freetile.js довольно просто использовать. Даже если вы не особо знакомы с javascript, вы без проблем поймете, что здесь к чему.

Freetile.js распространяется под лицензионным соглашением BSD, и доступен на GitHub.
Обнаружили ошибку или мёртвую ссылку?
Выделите проблемный фрагмент мышкой и нажмите CTRL+ENTER.
В появившемся окне опишите проблему и отправьте уведомление Администрации ресурса.
Нужна органическая вечная ссылка из данной статьи? Постовой?
Подробности здесь
Вам понравился материал? Поблагодарить легко!
Будем весьма признательны, если поделитесь этой статьей в социальных сетях:

Ключевые тэги: jQuery, адаптивный дизайн
Опубликовал Design FactoRy   Прочитано (раз): 6148   |   Нет комментариев
Источник материала / оригинал статьи   Распечатать
Другие статьи и новости по теме:
Добавление комментария
Уважаемые пользователи!
При добавлении комментариев на сайт Вам следует учитывать следующее - все комментарии проверяются Администрацией на предмет отсутствия спама. При обнаружении признаков спама, в оставленном Вами комментарии, сам комментарий будет незамедлительно удалён, а Ваш IP-адрес будет забанен без предупреждения! Учётные записи пользователей, рассылающих спам, блокируются/удаляются без права последующего восстановления.

С уважением, Администрация сайта.
* = поля обязательны к заполнению
Полужирный Наклонный текст Подчеркнутый текст Зачеркнутый текст | Выравнивание по левому краю По центру Выравнивание по правому краю | Вставка смайликов Выбор цвета | Скрытый текст Вставка цитаты Преобразовать выбранный текст из транслитерации в кириллицу Вставка спойлера
Вопрос : Назовите месяц January по-русски
Подтверждение кода безопасности :

Включите эту картинку для отображения кода безопасности
обновить, если не виден код


Популярные публикации


















Свежие шаблоны сайтов каждый день
С миру по нитке
«    Ноябрь 2017    »
ПнВтСрЧтПтСбВс
 12345
6789101112
13141516171819
20212223242526
27282930