в console все хорошо но slider не работает.что то не хватает в коде
const requestURL = 'https://jsonplaceholder.typicode.com/photos'
function sendRequest(url) {
return(fetch(url).then(response =>{
return response.json()
}))
}
let arrimg = [];
let count = 0;
sendRequest(requestURL).then(data =>
{
data = data.slice(0, 10);
// console.log(data)
for (let i = 0; i < data.length; i++){
arrimg.push(data[i].url);
}
slider()
});
function slider() {
let div = document.createElement('div');
document.body.append(div);
let next = document.querySelector('#next')
for (let i = 0; i < arrimg.length; i++) {
let imgs = document.createElement('img');
div.append(imgs);
imgs.src = arrimg[i];
next.addEventListener('click', nextSlider)
if (i !== count) {
imgs.style.display = 'none';
}
}
}
function nextSlider() {
count++
console.log(count)
console.log(arrimg[count])
}
<button id="back">BACK</button>
<button id="next">NEXT</button>
Ответы (1 шт):
Автор решения: Aziz Umarov
→ Ссылка
Не извращяйтесь делайте проще
const requestURL = 'https://jsonplaceholder.typicode.com/photos'
function sendRequest(url) {
return(fetch(url).then(response =>{
return response.json()
}))
}
let arrimg = [];
let count = 0;
sendRequest(requestURL)
.then(data =>
{
data = data.slice(0, 10);
for (let i = 0; i < data.length; i++){
arrimg.push(data[i].url);
}
show(0);
});
let div = document.getElementById('container');
let next = document.getElementById('next');
let img = document.getElementById('img');
next.addEventListener('click', nextSlider)
back.addEventListener('click', prevSlider)
let currentIndex = 0;
function show(index) {
img.src = arrimg[index];
}
function nextSlider() {
show(currentIndex++);
}
function prevSlider() {
show(currentIndex--);
}
<button id="back">BACK</button>
<button id="next">NEXT</button>
<div id="container">
<img id="img" src="">
</div>