Сетка товаров с возможностью фильтрации

Сетка товаров с возможностью фильтрации

От автора: макет отзывчивой сетки товаров с дружественной к сенсорным экранам галереей на основе Flickity и функцией фильтрации на основе Isotope.

скачать исходникидемо

Наш проект это отзывчивый макет сетки товаров на основе Isotope, где каждый элемент сетки это Flickity слайдер картинок. Товары, добавленные в корзину, помечаются маленькой иконкой тележки. Фильтр товаров работает на основе Isotope filter. Для того, чтобы сделать макет адаптивным, применяются медиа запросы. (Обратите внимание, что IE9 не поддерживает анимацию)

Использование Flickity от David DeSandro возможно по лицензии GNU GPL license v3. Если вы планируете использовать данный ресурс в коммерческих целях, пожалуйста, подробно ознакомьтесь с лицензией Flickity.

Практический курс по верстке адаптивного лендинга с нуля!

Научитесь с нуля верстать адаптивные лендинги на HTML5 и CSS3 за ближайшие 6 дней

Узнать подробнее

HTML

CSS

JavaScript

Посмотреть проект на Github

Автор: Mary Lou

Источник: http://tympanus.net/

Редакция: Команда webformyself.

Практический курс по верстке адаптивного лендинга с нуля!

Научитесь с нуля верстать адаптивные лендинги на HTML5 и CSS3 за ближайшие 6 дней

Узнать подробнее

Фреймворк Bootstrap - верстаем адаптивно, просто, быстро!

Получите видеокурс по основам Bootstrap

Получить

Метки: ,

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Я не робот.

Spam Protection by WP-SpamFree