On image slider generation | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
0

On image slider generation

How to use JavaScript to developed a simple image slider

30th Jun 2017, 7:23 AM
EVANS KIPTARUS KIBET
EVANS KIPTARUS KIBET - avatar
2 Answers
+ 1
1.Insert following code in HTML file <button id="prev" onclick="previous()">Prev</button> <img class="image" src="img/1.jpg" id="slider"> <button id="next" onclick="next()">Next</button> 2. Now in JavaScript: var images = ["img/1.jpg", "img/2.jpg", "img/3.jpg" ]; var num = 0; var t = setInterval(next, 7000); function previous() { var slider = document.getElementById("slider"); num--; if (num < 0) { num = images.length - 1; } slider.src = images[num]; } function next() { var slider = document.getElementById("slider"); num++; if (num > images.length - 1) { num = 0; } slider.src = images[num]; }
30th Jun 2017, 7:34 AM
Suman Shrestha
Suman Shrestha - avatar
30th Jun 2017, 8:33 AM
Elie Douaihy
Elie Douaihy - avatar