Я хочу увеличивать порядковый номер каждый раз, когда нажимается кнопка, чтобы сделать слайдер работающим - PullRequest
Новая
       1

Я хочу увеличивать порядковый номер каждый раз, когда нажимается кнопка, чтобы сделать слайдер работающим

0 голосов
/ 29 марта 2019

Я хочу увеличить порядковый номер изображения, чтобы фактически получать размер текущего изображения каждый раз, когда я нажимаю кнопку, вот код: 

var next = document.querySelector("#nextBtn");
var prev = document.querySelector("#prevBtn");
var imgContainer = document.querySelector(".imgContainer");
let img = document.querySelectorAll(".imgContainer > img");

Я хочу, чтобы var imgIndex = 0; увеличивал и сохранял новое значение, которое увеличивается. 

let size = img[imgIndex].clientWidth;
next.addEventListener('click', slideImg);

function slideImg() {
    imgContainer.style.transform = "translateX(" + (-size) + "px)";
    imgIndex++;
}

1 Ответ

0 голосов
/ 30 марта 2019

См. Этот код.Вы не можете использовать верхний индекс изображения вашей функции / глобального значения.Это то, что снова начинается с нуля. 

function slideImg() {
    var next = document.querySelector("#nextBtn");
    var prev = document.querySelector("#prevBtn");
    next.addEventListener('click', slideImg1);
}
var imgIndex = 0;
function slideImg1() {
    var imgContainer = document.querySelector(".imgContainer");
    let img = document.querySelectorAll(".imgContainer > img");
    let size = img[imgIndex].clientWidth;
    alert(imgIndex);
    img[imgIndex].style.transform = "translateX(" + (-size) + "px)";
    imgIndex++;
}
</script>

<body onload="slideImg()">
<input type="button" id="nextBtn" value="+" />
<input type="button" id="prevBtn" value="+" />
<div class="imgContainer">
    <img src="file" />
    <img src="file" />
</div>
</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...