Добавить автоматизацию в jQuery Content Slider - PullRequest
Новая
       0

Добавить автоматизацию в jQuery Content Slider

0 голосов
/ 22 февраля 2012

Мне нужна помощь для реализации таймера для этого скрипта, на который я ссылаюсь.

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

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

Я понимаю, что это много, но просить какой-то указатель было бы здорово, большое спасибо!

DEMO : http://jsbin.com/acorah

1 Ответ

1 голос
/ 22 февраля 2012

Ваш код получает небольшой удар по производительности с этим циклом each(), который, я думаю, вам не нужен. Вы связываете события внутри цикла и ограничиваете свои возможности, объявляя свои действия в области действия bind(). Вы хотите иметь возможность вызывать события для любого объекта, а не только для одного элемента; $('.cn_item') в вашем случае.

Идея состоит в том, чтобы отслеживать текущий слайд с помощью класса, скажем, .cur.
Затем вы создаете объект, где вы объявляете все свои методы. Основными методами или действиями являются getCur() и goTo(), и в основном все остальные будут использовать их. то есть. next() это просто сокращение для goTo()

var actions = {
    getCur: function(){ return idx; },
    goTo: function(idx){
        // The simplest case
        $slides.hide().eq(idx).show();
    },
    next: function(){ this.goTo(this.getCur()+1); },
    prev: function(){ this.goTo(this.getCur()-1); }
    .
    .
    .
}

Теперь вы можете вызывать действия над событиями, просто выполнив следующее: 

$slides.click(function(){ actions.goTo($(this).index()); });
$next.click(function(){ actions.next(); });

И тогда вы можете setInterval() добавить таймер. 

setInterval(actions.next, 1000);

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

...