Spójrz na kod z mojego posta:
https://forum.pasja-informatyki.pl/423288/jak-stworzyc-projekt-przedstawiony-na-tym-obrazku
#one1, #one2, #one3 {
background: orange;
width: 100px;
height: 100px;
display: none;
}
#one2 {
background: silver;
}
#one3 {
background: brown;
}
#one3 {
display: block;
}
<body style="background: olive;">
<div id="one1">1</div>
<div id="one2">2</div>
<div id="one3">3</div>
<button id="left">left</button>
<button id="right">right</button>
const left = document.getElementById('left');
const right = document.getElementById('right');
var slide_which = document.querySelector('#one1, #one2, #one3').length;
[left, right].forEach(function(a) {
a.addEventListener('click', function() {
if(slide_which > 1 && this.id == 'left') {
let aqq = slide_which - 1;
document.getElementById('one' + aqq).style.display = 'block';
document.getElementById('one' + slide_which).style.display = 'none';
slide_which--;
}
if(slide_which < 3 && this.id == 'right') {
let aqq = slide_which + 1;
document.getElementById('one' + aqq).style.display = 'block';
document.getElementById('one' + slide_which).style.display = 'none';
slide_which++;
}
}, false);
});
</body>