Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Как зациклить карусель? (https://javascript.ru/forum/dom-window/56913-kak-zaciklit-karusel.html)

Maggie 09.07.2015 17:15

Как зациклить карусель?
 
Привет. Подскажите как зациклить карусель или стопануть стрелку вправо после просмотра всех изображений?
В конце страницы карусель:
http://www.gulftravel.com.ua/countri.../o-strane.html

Вот код карусели:
$(document).ready(function() {
    var leftUIEl = $('.carousel-arrow-left');
    var rightUIEl = $('.carousel-arrow-right');
    var elementsList = $('.imageRow');
 
    var pixelsOffset = 400;
    var currentLeftValue = 0;
    var elementsCount = elementsList.find('li').length;
    var minimumOffset = - ((elementsCount - 5) * pixelsOffset);
    var maximumOffset = 0;
 
    leftUIEl.click(function() {        
        if (currentLeftValue != maximumOffset) {
            currentLeftValue += 400;
            elementsList.animate({ left : currentLeftValue + "px"}, 500);
        }        
    });
 
    rightUIEl.click(function() {        
        if (currentLeftValue != minimumOffset) {
            currentLeftValue -= 400;
            elementsList.animate({ left : currentLeftValue + "px"}, 500);
        }
    });
 
});

kostyanet 09.07.2015 18:01

Ну так else перекрестно.

Maggie 09.07.2015 18:05

А можно подробнее? А то я в js полный профан

рони 09.07.2015 18:49

бесконечная карусель
 
Maggie,
можно и зациклить ...
$(document).ready(function() {
    var leftUIEl = $('.carousel-arrow-left');
    var rightUIEl = $('.carousel-arrow-right');
    var elementsList = $('.imageRow');
    var currentLeftValue = 0;
    elementsList.append(elementsList.find('.single')); //без div.set  красивее
    leftUIEl.click(function() {
        currentLeftValue = elementsList.find('.single').eq(1).position().left;
        elementsList.stop().animate({
            left: -currentLeftValue + "px"
        }, 500, function() {
            elementsList.append(elementsList.find('.single').first());
            elementsList.css({
                left: 0
            })
        });

    });

    rightUIEl.click(function() {
        elementsList.prepend(elementsList.find('.single').last());
        currentLeftValue = elementsList.find('.single').eq(1).position().left;
        elementsList.css({
            left: -currentLeftValue + "px"
        })
        elementsList.stop().animate({
            left: 0
        }, 500)
    });

});

kostyanet 09.07.2015 19:00

Цитата:

Сообщение от Maggie
А то я в js полный профан

Странно, а коды карусели нашли. Там есть проверки на мин и макс, надо поставить else на симметричную функцию и все.

leftUIEl.click(function() {
    if (currentLeftValue != maximumOffset) {
    /* тут все по тексту */
    else 
        rightUIEl.click();


и еще раз в правой на левую.

рони 09.07.2015 19:15

Цитата:

Сообщение от kostyanet
Там есть проверки на мин и макс

если бы только сами мин и макс не были от фонаря

Maggie 10.07.2015 09:32

Спасибо, рони, помогли, всё работает... только вот в противоположную сторону катало, но я вроде бы поняла что сделать нужно)

рони 10.07.2015 09:55

Цитата:

Сообщение от Maggie
только вот в противоположную сторону катало

как это понять?

рони 10.07.2015 10:04

Maggie,
left и right в строках 2 и 3 поменять местами или в начале или в конце строк

Maggie 10.07.2015 10:51

Да, спасибо, поменяла уже)


Часовой пояс GMT +3, время: 17:37.