Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 28.01.2015, 12:52   #1
L6go1as
Форумчанин
 
Регистрация: 20.10.2011
Сообщений: 433
По умолчанию Цикличный слайдер

Добрый день уважаемые, нуждаюсь в совете.

Хочу сделать следующее: цикличный слайдер, в конце цикла идет старт нового цикла.

В принципе код рабочий, однако, по окончанию цикла идет резкая прокрутка на первый слайд. А что нужно дописать что бы цикл начался без прокрутки (0->1->2->0 и т.д.)

Код:
<script>
var slideWidth = 300;
var sliderTimer;
$(function(){
$('.slidewrapper').width($('.slidewrapper').children().length*slideWidth);
    sliderTimer = setInterval(nextSlide, 3000);
});

function nextSlide(){
	var currentSlide = parseInt($('.slidewrapper').data('current'));
	//alert(currentSlide);
    currentSlide++;
    if(currentSlide == $('.slidewrapper').children().length)
    {
        currentSlide = 0;   
    }
    $('.slidewrapper').animate({left: -currentSlide*slideWidth}, 250).data('current', currentSlide);
}
</script>
L6go1as вне форума Ответить с цитированием
Старый 29.01.2015, 05:44   #2
Fenex
Форумчанин
 
Аватар для Fenex
 
Регистрация: 15.02.2012
Сообщений: 823
По умолчанию

Документация почитать надо, там наверняка об этом рассказано.

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

Как-то так:
Код:
function nextSlide(){
	var currentSlide = parseInt($('.slidewrapper').data('current'));
	//alert(currentSlide);
    currentSlide++;
    if(currentSlide == $('.slidewrapper').children().length)
    {
        currentSlide = 0;
        $('.slidewrapper').animate({left: 1*slideWidth}, 0).data('current', 1);

    }
    setTimeout(function() {
        $('.slidewrapper').animate({left: -currentSlide*slideWidth}, 250).data('current', currentSlide);
    }, 10);
}
Но всё же лучше почитать доки.
^-.-^ My GitHub

Последний раз редактировалось Fenex; 29.01.2015 в 05:46.
Fenex вне форума Ответить с цитированием
Старый 29.01.2015, 11:06   #3
L6go1as
Форумчанин
 
Регистрация: 20.10.2011
Сообщений: 433
По умолчанию

Fenex, Спасибо за совет и код, попробую посмотреть как пойдет.
Конечно же тяжеловато пока, ибо js для меня темный лес.

Если возможно установить скорость анимации 0, то ведь, по сути, можно сделать "моментальную" перемотку и пользователь этого не заметит.

Или тут где-то подводный камень ?
L6go1as вне форума Ответить с цитированием
Старый 29.01.2015, 19:31   #4
Fenex
Форумчанин
 
Аватар для Fenex
 
Регистрация: 15.02.2012
Сообщений: 823
По умолчанию

Цитата:
Если возможно установить скорость анимации 0, то ведь, по сути, можно сделать "моментальную" перемотку и пользователь этого не заметит.
Можно, никаких камней нет.
^-.-^ My GitHub
Fenex вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Простой слайдер Gstar JavaScript, Ajax 0 30.09.2013 01:12
Слайдер на jQuery CraZZZy-GameRRR JavaScript, Ajax 7 27.07.2012 01:39
Слайдер видеороликов Minus_yu JavaScript, Ajax 4 14.04.2012 12:51
Слайдер dekameron JavaScript, Ajax 0 05.04.2011 04:39