Главная » Каталог » Слайдеры и слайдшоу » Responsive jQuery Content Slider - полностью адаптивный слайдер с массой возможностей

Слайдеры и слайдшоу

Responsive jQuery Content Slider - полностью адаптивный слайдер с массой возможностей



Почему я должен пользоваться именно этим слайдером?
- Полностью респонсивный - будет подстраиваться под любое устройство
- Горизонтальная, вертикальная прокрутка слайдов, затухание
- Слайды могут содержать изображение, видео, HTML-контент
- Поддержка сенсорного управления, встроенный swipe-суппорт
- Использует CSS-переходы для слайд-анимации (родное аппаратное ускорение!)
- Полный обратный вызов API и публичные методы
- Небольшой размер файла, полностью опирающийся на определённую тему, прост в реализации
- Поддержка браузеров: Firefox, Chrome, Safari, IOS, Android, IE7 +
- Тонны конфигурационных опций



Как установить

Шаг 1: подключение необходимых файлов

Код

<!-- jQuery library (served from Google) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="/js/jquery.bxslider.min.js"></script>
<!-- bxSlider CSS file -->
<link href="/lib/jquery.bxslider.css" rel="stylesheet" />


Шаг 2: создание HTML-разметки

Код

<ul class="bxslider">
  <li><img src="/images/pic1.jpg" /></li>
  <li><img src="/images/pic2.jpg" /></li>
  <li><img src="/images/pic3.jpg" /></li>
  <li><img src="/images/pic4.jpg" /></li>
</ul>


Шаг 3: вызов bxSlider

Код

$(document).ready(function(){
  $('.bxslider').bxSlider();
});


Для получения дополнительной информации по установке и настройке перейдите в примеры и часто задаваемые вопросы.
Обсуждение материала:
Комментариев: 0
avatar

Другие материалы:

    ResponsiveSlides.js - простой и легкий плагин респонсивного слайдера

    25.09.2016

    ResponsiveSlides.js - крошечный плагин jQuery, позволяющий создать респонсивный слайдер с помощью элементов внутри контейнера. Используется на таких сайтах, как Microsoft's Build 2012 и Gridset App. Работает в широком диапазоне браузеров, включая все версии IE от IE6 и выше. Зависим лишь от jQuery (поддерживается версия от 1.6 и выше) и особенностью является одинаковый размер всех изображений.

    Комментарии: 0   Просмотры: 262

    SlidesJS - многофункциональный слайдер для изображений

    11.09.2016

    Не просто слайдер, а многофункциональный слайдер, в архиве вы найдёте примеры различного исполнения слайдера - от стандартного, до слайд-шоу с возможностью постановки на паузу прокрутки слайдов, использования эффектов при смене слайдов. Реализована возможность одновременного размещения нескольких слайдеров на странице сайта.

    Комментарии: 0   Просмотры: 301

    Ninja Slider: респонсивный слайдер (слайд-шоу) изображений

    28.08.2016

    Отличный вариант слайдера с богатыми возможностями: здесь и слайд-шоу для слайдов, и расширение (увеличение) области слайдера по клику, возможность использования в слайдере контента, видео, аудио, поддержка галереи с превьюшками изображений, галереи с слайдером в окне лайтбокса , адаптивность, вобщем всё круто!

    Комментарии: 0   Просмотры: 268

Хостинг от uCoz