fifovandrej560,
нажать на картинку, подождать 5 сек.
<!DOCTYPE HTML>
<html>
<body>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function() {
// скроем изображдения в начале
$("#imgs img").hide();
// выберем первое изображение как стартовое
var select = $("#imgs img:eq(0)");
//покажем первую картинку
select.show();
// вместо кнопок использую само изобюражения
$("#imgs img").click(function() {
//скроем текущее изображение
select.stop().delay(5000).hide(function() {
//выберем следующее изображение
select = select.next();
//если следующего изображения нет (ну нету, кончились они :) ), тогда выберем вновь первое изображение
if (select.attr("src") == undefined) {
select = $("#imgs img:eq(0)");
};
//покажем вновь выбранное изображение.
select.show();
});
});
});
</script>
<div id="imgs" align="left">
<img width="200px" src="https://loremflickr.com/170/350/dog,hound?random=1" />
<img width="200px" src="https://loremflickr.com/170/350/dog,hound?random=2" />
<img width="200px" src="https://loremflickr.com/170/350/dog,hound?random=3" />
<img width="200px" src="https://loremflickr.com/170/350/dog,hound?random=4" />
<img width="200px" src="https://loremflickr.com/170/350/dog,hound?random=5" />
<img width="200px" src="https://loremflickr.com/170/350/dog,hound?random=6" />
<img width="200px" src="https://loremflickr.com/170/350/dog,hound?random=7" />
</div>
</body>
</html>
