VPF::[jQuery] Не отображается элемент через fadeIn

hellodakotta

Дата 9.10.2013, 00:57 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 3
Регистрация: 7.9.2013

Репутация: нет
Всего: нет

Здравствуйте!

Есть слайдер-карусель, при котором по нажатию на кнопки #prev и #next должен появляться элемент-стрелочка (.current_img), которой подсвечивает текущий слайд .cycle-slide-active.
Слайдер циклический (бесконечно прогоняет все картинки по кругу).
Когда жмем на #next находясь на последнем слайде, то переходит на первый слайд, но .current_img не отображается.
Аналогично, когда жмем на #prev - не отображается .current_img только у последнего слайда.

Кроме первого и последнего слайдов все работает.
Помогите найти ошибку, пожалуйста!!!

Вот код

Код


$("#prev").click(function(){
                    $(".cycle-slide-active").removeClass('cycle-slide-active').prev().addClass('cycle-slide-active');
//скрываем все стрелки
                    $('.current_img').stop(true,true).fadeOut();
//отображаем стрелку у текущего слайда
                    $(".cycle-slide-active").find('.current_img').stop(true,true).fadeIn();
});
$("#next").click(function(){
                    $(".cycle-slide-active").removeClass('cycle-slide-active').next().addClass('cycle-slide-active');
                    $('.current_img').stop(true,true).fadeOut();
                    $(".cycle-slide-active").find('.current_img').stop(true,true).fadeIn();
});

JAYBE

Дата 22.10.2013, 16:52 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 220
Регистрация: 27.3.2008

Репутация: -1
Всего: 0

Код


$("#prev").click(function(){
    if ( $(".cycle-slide-active").prev() ) { //есть ли предыдущий элемент или мы сейчас показываем 1-ый?
        $(".cycle-slide-active").removeClass('cycle-slide-active').prev().addClass('cycle-slide-active');
    } else {// если первый, то значит надо показать последний
        $(".cycle-slide-active").removeClass('cycle-slide-active').parent().last().addClass('cycle-slide-active');
    }
                    // (".cycle-slide-active").removeClass('cycle-slide-active').prev().addClass('cycle-slide-active');
//скрываем все стрелки
                    $('.current_img').stop(true,true).fadeOut();
//отображаем стрелку у текущего слайда
                    $(".cycle-slide-active").find('.current_img').stop(true,true).fadeIn();
});
$("#next").click(function(){
    if ( $(".cycle-slide-active").removeClass('cycle-slide-active').next() ) { //есть ли следующий элемент или сейчас активен последний?
        $(".cycle-slide-active").removeClass('cycle-slide-active').next().addClass('cycle-slide-active');
    } else {// этот скрываем, а показываем 1-ый, так как после текущего элемента ничего нету (конец)

    }
                    // $(".cycle-slide-active").removeClass('cycle-slide-active').next().addClass('cycle-slide-active');
                    $('.current_img').stop(true,true).fadeOut();
                    $(".cycle-slide-active").find('.current_img').stop(true,true).fadeIn();
});

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

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Применение библиотек \| Следующая тема »