Меняющиеся картинки

[ber104]

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

[exec]

function toggleImage( a ) {
	var images = [ '1.png', '2.png', '3.png' ];
	a.src = images[ images.indexOf( a.src ) + 1 ];
}

toggleImage( this );

[ber104]

Спасибо!!

[ber104]

Вот только почему как-бы есть 4 картинка которая не показывает?
Как исправить?

[exec]

function toggleImage( a ) {
	var images = [ '1.png', '2.png', '3.png' ];
	a.src = images[ images.indexOf( a.src ) == images.length ? 0 : images.indexOf( a.src ) + 1 ];
}

[ber104]

также...
Можно исправить?

[рони]

exec,
indexOf не работает для массивов в Internet Explorer, в других браузерах indexOf возвращает индекс (если найдено или -1) индекс не может равнятся длине массива - максмимум длина массива минус один

images.indexOf( a.src ) == images.length

как вариант можно так

var images = ["1.png", "2.png", "3.png"];

function toggleImage(a) {
    images.push(images.shift());
    a.src = images[0]
};

[ber104]

Спасибо огромное! Все работает!

[ber104]

А можно ли сделать чтобы они назад шли, предыдущие показывали?

[x-yuri]

function nextImage( a ){
    if( ! nextImage.images ){
        nextImage.images = [...];
        nextImage.i = 0;
    }
    nextImage.i = (nextImage.i+1) % nextImage.images.length;
    a.src = nextImage.images[nextImage.i];
}