Local carousel
Опубликовано: 27.09.2017
А вот и подоспела очередная рубрика в моем блоге — #длясамыхмаленьких . В ней я буду рассказывать вам о простых вещах из мира веб-разработки доступным языком (попытаюсь во всяком случае). Сегодня мы поговорим о такой банальной вещи как слайдер. Скорее всего на подавляющем количестве сайтов в том или ином виде присутствует этот элемент, см. Local carousel. Он позволяет запихать большой объем данных в ограниченное по размеру место, да и в целом способов его применения масса.
За свою жизнь я перепробовал кучу всевозможных слайдеров и в качестве основного у меня всегда был «FlexSlider 2» до того момента пока я не попробовал героя нашей сегодняшней записи — Owl Carousel 2.
Owl Carousel 2 — Гибкий, приятный и удобный в использовании слайдер. Он интуитивно понятно себя ведет, адаптивен, замечательно себя чувствует на любых платформах и разрешениях. Использовать его в работе — одно удовольствие.
Собсно для начала нам нужно его скачать. Пакет доступен из npm и bower:
npm npm install --save owl.carousel
bower bower install --save owl.carousel
Если вы не хипстер используете пакетные менеджеры, то можно скачать с гитхаба в разделе релизов: Скачать Owl Carousel 2
На момент написания статьи актуальная версия 2.1.6 и в качестве примера я буду использовать ее.
Само собой нам так же понадобиться jQuery.
Скачав и распаковав Owl Carousel 2 нам нужно его подключить. Для этого в <head> добавляем стили:
Local Carousel Anzeige in Deutschland - Google Karussell
Google Local Carousel Test - Aiden