Слайдер Bootstrap Ken Burns Effect Carousel


Слайдер Bootstrap Ken Burns Effect Carousel
Собрал слайдер Bootstrap Ken Burns Effect Carousel и теперь делюсь с читателями своего сайта. Согласитесь, стандартный плагин Bootstrap Carousel довольно скудный, имеющий всего один эффект, без анимации. Разработчики оправдывают это четкой работой слайдера в различных браузерах.

Данный Bootstrap Ken Burns Effect Carousel слайдер я протестировал в Google Chrome, Mozilla, Opera, Yandex. Работает корректно. И отлично подойдет для лендингов, тут можно сэкономить на скорости загрузки страницы. Если лендинг на Bootstrap, то не нужно подключать сторонние скрипты слайдера.

Слайдер Bootstrap Ken Burns Effect Carousel

Что внутри:

Внутри слайдера Bootstrap Ken Burns Effect Carousel стандартная сборка Bootstrap. Остановлюсь здесь на дополнениях.

  • Файл index.html — разметка для ориентира помечена комментами;
  • Файл animate.min.css — анимация, нужна для движения надписей в слайдере. Анимация взята отсюда http://daneden.github.io/animate.css/. Кто собирает лендинги, данная анимация должна быть хорошо знакома;
  • Файл ken-burns.css — собственно CSS эффекты, для достижения Ken Burns Effect. Этот файл можно скопировать и добавить в пользовательский CSS шаблона;
  • Файл custom.js — инициализация и настройки Bootstrap Ken Burns Effect Carousel;

Ну вот собственно и все.

Несколько советов по использованию слайдера Bootstrap Ken Burns Effect Carousel

Для стрелок навигации подключена полная библиотека иконочных шрифтов Font Awesome, но если вы больше не используете их в своем проекте, то лучше заменить их png иконками.

Изображения для данной Bootstrap Ken Burns Effect Carousel подбирайте по размеру примерно как в исходниках, лучше одинаковые по размерам.

Вопросы задавайте в комментариях. Исходники я залил на GitHub, ссылка для скачивания ниже.

Скачать

Счастливая надпись неоновая вывеска светится. Смотрите тмз на сайте.


Похожие по Тегам статьи


One thought on “Слайдер Bootstrap Ken Burns Effect Carousel

  1. Альберт

    Ура! С возвращением, Егор! Надеюсь, что сайт продолжит активную работу обучения неучей. )) Жду с нетерпением! )))
    Удачи и успехов тебе!