<body>
<div class="slider">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWLNwhChX4ONI6FqmhVInj6-0cqKSc5FE_8YLAPeJSbYyVyv-biI9q9JJdrHT0nuYq4sp5KytZikq6X2vytHY5qVVIsY7gmcvomwbKKFC1fuRLS7puWqklUdTaL_7Im6Np6ebE3aZYq1I/s1600/Pot+anggrek+Jogja.jpg" alt="Image 1">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaahKmsIz2TxSmCigB2swrWiC7f-Eycxpr3ExVvisuZns78qj2rue0uevwv20bwgyzeCiODSqrj77G1p0SUjwg1PmIeE_C89S5dN9fHPGJhH7Hoc0Q8_vWUgE614IRBB-Gth21A0yOUCE/s1600/air+mancur+mini.JPG" alt="Image 2">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhu_XoKRgQALTktzxd52fBHNEZOCuTZhCG7WkAFobPh1R_ZD9wE0Zm8dYU6Ubpm2y3VyErhfX63n62DoDpjt3Kk04JicbyMy25ktumnQr78DHfGiw6p4Ed3zfWwUbY4KygEqCz1smbijCU/s1600/kawat+bonsai+jogja.jpg" alt="Image 3">
<!-- tambahkan sebanyak yang Anda butuhkan -->
</div>
</body>
<style> overflow: hidden;
display: flex;
}
.slider img {
width: 100%;
height: auto;
}
</style>
<script> var slider = document.querySelector('.slider');
var sliderImages = document.querySelectorAll('.slider img');
var current = 0;
// Clear all images
function reset() {
for (var i = 0; i < sliderImages.length; i++) {
sliderImages[i].style.display = 'none';
}
}
// Init slider
function startSlide() {
reset();
sliderImages[0].style.display = 'block';
}
// Show prev
function slideLeft() {
reset();
sliderImages[current - 1].style.display = 'block';
current--;
}
// Show next
function slideRight() {
reset();
sliderImages[current + 1].style.display = 'block';
current++;
}
// Left arrow click
slider.addEventListener("swipeleft", function() {
if (current === 0) {
current = sliderImages.length;
}
slideLeft();
});
// Right arrow click
slider.addEventListener("swiperight",
</script>
