Search the Community

On the tutorial for an image gallery slideshow (https://www.w3schools.com/howto/howto_js_slideshow_gallery.asp) the example starts with the first image enlarged. The code they provided doesn't apply that to my website, I have to select an image to enlarge it, is there something I can add? Thanks

The code provided for 'Javascript Automatic Image Slideshow' code is weak and not optimal. It is bit confusing and does n't reflect the best of W3schools. Please check the link attached here(http://www.w3schools.com/w3css/w3css_slideshow.asp) I suggest an edit. Please compare the current code shown in w3schools(1) and my edited code(2): 1. ------------------------------------------------------------------------------------------------------------------------------------------------------------------ <script> var myIndex = 0; carousel(); function carousel() { var i; var x = document.getElementsByClassName("mySlides"); for (i = 0; i < x.length; i++) { x.style.display = "none"; } myIndex++; if (myIndex > x.length) {myIndex = 1;} x[myIndex-1].style.display = "block"; setTimeout(carousel, 2000); // Change image every 2 seconds } </script> ------------------------------------------------------------------------------------------------------------------------------------------------------------------ 2. <script> var myIndex = 0; var x = document.getElementsByClassName("mySlides"); carousel(); function carousel() { if(myIndex!=0){x[myIndex-1].style.display="none";} if (myIndex > (x.length-1)) {myIndex = 0} x[myIndex].style.display = "block"; myIndex++; setTimeout(carousel, 2000); // Change image every 2 seconds } </script> ------------------------------------------------------------------------------------------------------------------------------------------------------------------