Почему перебор элементов не работает по кругу
Суть такая. Просто жму на кнопку "next", запускается цикл, цикл перебирает элементы. Если находит элемент с z-index равным 10, то у самого элемента меняет его на 0, а у следующего за ним ставит z-index равным 10. То есть просто банальная переключалка друг за другом. Но почему не получается по кругу, то есть когда доходит до последнего элемента (и если у него z - index равен 10) то у себя ставит 1, а у первого 10) что бы заново запустить круг. Мой код работает до последнего а дальше ошибка, подскажите почему?
https://jsfiddle.net/3shy5epq/2/ |
Sinevik,
не проверяйте стиль, вам нужен индекс !!! его и меняйте без всяких for и if. 3 строка var index = 0; |
как устроены слайдеры (бесконечный цикл в обе стороны)
Sinevik,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
article{
position: absolute;
height: 100px;
width: 100px;
background-color: #FFFFFF;
}
div {
position: relative;
}
</style>
</head>
<body>
<input name="" type="button" value="prev" onclick="prev()"> <input name="" type="button" value="next" onclick="next()">
<div>
<article style="z-index: 10">1</article>
<article>2</article>
<article>3</article>
<article>4</article>
<article>5</article>
</div>
<script>
var slider = document.getElementsByTagName("article");
var index = 0;
function next()
{
slider[index].style.zIndex = 1;
index = ++index % slider.length;
slider[index].style.zIndex = 10;
}
function prev()
{
slider[index].style.zIndex = 1;
--index < 0 && (index = slider.length - 1);
slider[index].style.zIndex = 10;
}
</script>
</body>
</html>
|
Почему я не могу добаить +? пишет
"Вы должны добавить отзыв кому то еще?" |
Защита от накруток
|
| Часовой пояс GMT +3, время: 23:53. |