прервите цикл, чтобы запустить событие .click, затем перезапустите цикл. - PullRequest
Новая
       13

прервите цикл, чтобы запустить событие .click, затем перезапустите цикл.

0 голосов
/ 21 июня 2011

Я скажу, что я имею в виду:

http://www.pixel3.it/marco/jslide/slide.html

У меня есть базовое слайд-шоу .click, которое скользит по всем цветным прямоугольникам, нажимая на маленькие квадраты ниже.«До сих пор все хорошо.

Теперь я действительно хочу, чтобы цветные прямоугольники зацикливались навсегда, поэтому я использую этот код: 

$(document).ready(function runIt(){
    $('#slider').animate({marginLeft: "0"}, 500).delay(5000);
    $('#slider').animate({marginLeft: "-900"}, 500).delay(5000);
    $('#slider').animate({marginLeft: "-1800"}, 500).delay(5000);
    runIt;
});

Это работает хорошо, но я больше не могу переключатьсяящики вручную.

Мне было интересно, можно ли было смешать эти два куска кода: 

    $('#slider').animate({marginLeft: "0"}, 500).delay(5000);
    $('#slider').animate({marginLeft: "-900"}, 500).delay(5000);
    $('#slider').animate({marginLeft: "-1800"}, 500).delay(5000);
    runIt;
});

    $('a#but1').click(function(){
    $('#slider').animate({marginLeft: "0"}, 500)
    });

    $('a#but2').click(function(){
    $('#slider').animate({marginLeft: "-900"}, 500)
    });

    $('a#but3').click(function(){
    $('#slider').animate({marginLeft: "-1800"}, 500)
    });
});

заставляя ящики зацикливаться, пока я не нажму один из цветных квадратов, что и делает.событие щелчка, а затем перезапустите цикл.

РЕДАКТИРОВАТЬ: я пытался добавить .stop () для каждого события .click, но не работает.

EDIT2 (почти решено):После небольшого поиска и с некоторой удачей я нашел этот плагин: http://flesler.blogspot.com/2007/10/jqueryscrollto.html Я думаю, что это может помочь мне также.

Прямо сейчас, используя только этот плагин цикла, мой код: 

$('#slider').cycle({fx: 'scrollLeft',
                speed:    500, 
                timeout:  5000});

    $('a#but1').click(function() { 
        $('#slider').cycle(0); 
        return false; 
    }); 

    $('a#but2').click(function() {  
        $('#slider').cycle(1);  
        return false;  
    }); 

    $('a#but3').click(function() { 
        $('#slider').cycle(2); 
        return false; 
    }); 


});

К сожалению, этот плагин не прокручивает все кадры, а только текущий и следующий.Я имею в виду, если я нажимаю 3-й квадрат, когда слайд-шоу находится на 1-м блоке, во время анимации 2-й блок не рассматривается.Надеюсь, я прав, потому что я прочитал документацию по плагину цикла и не нашел ни одной команды для этого.

1 Ответ

0 голосов
/ 21 июня 2011

Возможно, вам лучше подойдет что-то вроде слайд-шоу jquery (http://jquery.malsup.com/cycle/)to справьтесь с вашими переходами.

Подобный цикл может никогда не допустить возникновения управления событиями и может быть ответственным за то, почему ваши события щелчка, кажется, не срабатывают. Возможно, они ожидают завершения цикла, прежде чем будут обработаны. Таким образом, вы создали бесконечный цикл, и ваши события ожидают ожидания.

...