Здравствуйте. Нужно сделать слайдер, плавно пролистывающий ряд изображений справа налево, задерживаясь на изображении на несколько секунд. После последнего изображения вернуться на первое.
В javascript, как и в программировании в целом, я нуб)
Нужно именно на javascript, готовые решения не подойдут, так как это для курсача, и я преподу не докажу, что сам сделал))
function sliderscroll() { //Прокрутка слайдера
var i=0; // Текущее смещение
var posx = 0; //Текущая позиция
var scrll=0; //Смещение + текущая позиция = новая позиция (для пауз)
this.next = function() //функция пролистывания на одно изображение вперед
{
if (posx!=-1800){ //1800 - ширина всех картинок
if (i!=-900){ //900 - ширина одной картинки (т.е., всего 3 картинки)
i=i-50; //на 50 пикселей смещение каждый раз
posx=scrll+i;
document.getElementById('slider').style.left=posx+'px';
setTimeout(arguments.callee,10);
} else {
scrll=posx;
i=0;
setTimeout(arguments.callee,3000);
};
} else {
new sliderscroll().tofirst(); //если дошли до конца, это функция пролистывания в начало
};
};
this.tofirst = function() //функция пролистывания в начало
{
if (posx!=0) { //листаем до того, как станет в 0
i=i+100; //листаем с шагом в 100 пикселей
posx=scrll+i;
document.getElementById('slider').style.left=posx+'px';
setTimeout(arguments.callee,10);
} else {
new sliderscroll().next(); //начинаем листать опять сначала
};
};
Вопросы такие - как правильно сделать паузу на показ каждого изображения? Сейчас получается, что пауза есть только между 1и2 изображениями, а на конечных начинают выполнятся сразу действия, без паузы (либо пролистывание вперед, либо пролистывание в начало)
И вроде бы переменная posx глобальная, а получается, что в функции пролистывания в начало она равна 0.
И вообще, очень бредово все это выглядит, наверное, но могу как могу)