Настройка навигации jCarousel с автопрокруткой

У меня возникли небольшие проблемы с настройкой jCarousel -

www.lovejungle.com/store

По сути, я хочу, чтобы это выглядело как слайд-шоу на www.ripcurl.com.au/?home.

Я дошел до реализации jCarousel - но кнопки конфигурации и навигации неверны.

Как вы увидите, jCarousel начинается с первого изображения, но затем пропускает два изображения и переходит к четвертому изображению в наборе. Я не уверен, почему это делается? Любые идеи?

Во-вторых, я не могу получить навигацию по умолчанию 1,2,3,4,5 в левом нижнем углу.

Я предполагаю, что это как-то связано с моей функцией javascript (я не очень в этом разбираюсь)

<script type="text/javascript">

function mycarousel_initCallback(carousel)
{
    // Disable autoscrolling if the user clicks the prev or next button.
    carousel.buttonNext.bind('click', function() {
        carousel.startAuto(1);
    });

    carousel.buttonPrev.bind('click', function() {
        carousel.startAuto(0);
    });

    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
};

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        auto: 3,
        wrap: 'both',
        initCallback: mycarousel_initCallback
    });
});

</script>

Любая помощь будет принята с благодарностью.

Ознакомиться с форматированием можно здесь:

www.sorgalla.com/projects/jcarousel/


jquery jcarousel
person Michael Birchall    schedule 08.03.2010    source источник

Ответы (2)


arrow_upward
5
arrow_downward

Что касается вашей проблемы с прокруткой, есть параметр конфигурации, который сообщает JCarousel, сколько элементов нужно прокручивать за раз, для которого по умолчанию установлено значение 3.

jQuery(document).ready(
    function() { jQuery('#mycarousel').jcarousel({ 
        auto: 3, 
        wrap: 'both',  
        initCallback: mycarousel_initCallback,
        scroll: 1
    }); 
});

Я добавил scroll: 1 к вашей функции инициализации, которая скажет JCarousel прокручивать 1 элемент за раз.

person Casey Kinsey    schedule 12.07.2010

arrow_upward
1
arrow_downward

Функция mycarousel_initCallback должна быть

function mycarousel_initCallback(carousel)
{
    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
};

работает на меня!!!

person Elminson De Oleo Baez    schedule 25.02.2012