Слайдер Owl Carousel — как сделать caption фиксированным?

Question

[Moe Green]

Доброго времени суток всем!

Имеется готовая несложная верстка страницы - Utopic Flowers.

На странице применен Owl Carousel в виде слайдера.

Вопрос заключается в том, как в данном случае сделать блок caption фиксированным? Чтобы в нем менялось только содержимое, но сам блок оставался на заданном месте, а не "бегал" вместе с блоком li?

P. S.
Желающие могут оценить качество верстки страницы. Автора интересует качество его верстки, как кодера. :)

Answer 1

[Сергей]

Страница с примером — 404.

Блок caption вынести в блок, отдельный от слайдера, и спозиционировать его как нужно. Через API слайдера по колбеку (скорее всего это afterMove или afterAction owlgraphic.com/owlcarousel/index.html#customizing ) менять содержимое как требуется.

Колбеки используются так:

$(document).ready(function() {
  $(".slider").owlCarousel({
    navigation : true,
    pagination: true,
    singleItem:true,
    autoPlay: true,
    afterMove: function () {
       // здесь делаешь то, что нужно после движения
   }
  });
});

А вообще советую использовать версию 2 этого слайдера, он более продвинутый и в плане API тоже: www.owlcarousel.owlgraphic.com/index.html

Comments

[Moe Green]

ссылку поправил. с callback'ами слайдера еще ни разу не сталкивался, не знаю вообще, как с ними работать. (

[Moe Green]

спасибо за подсказку! вот со знаниями js+jquery у меня туговато, правда. придется подтягивать их постепенно.

Answer 2

[nublog]

.owl-controls {
left: 0;
bottom: 15px;
position: fixed;
z-index: 333;
}

Comments

[Moe Green]

нет, не получается.