SLIDESHOW WITH MOUSE SCROLLING
.
.
.
.
.
<img id="slideshow" src="https://i.imgur.com/Pq9Dexal.jpg" /> <script> var myimages=[ "https://i.imgur.com/Pq9Dexal.jpg", "https://i.imgur.com/kbCkBYel.jpg", "https://i.imgur.com/gCr4ycDl.jpg", "https://i.imgur.com/JcRaeRSl.jpg", "https://i.imgur.com/XMS6PHsl.jpg", "https://i.imgur.com/I9SFA0sl.jpg"] var slideshow=document.getElementById("slideshow") var nextslideindex=0 function rotateimage(e){ var evt=window.event || e var delta=evt.detail? evt.detail*(-100) : evt.wheelDelta nextslideindex=(delta<=-100)? nextslideindex+1 : nextslideindex-1 nextslideindex=(nextslideindex<0)? myimages.length-1 : (nextslideindex> myimages.length-1)? 0 : nextslideindex slideshow.src=myimages[nextslideindex] if (evt.preventDefault) evt.preventDefault() else return false} var mousewheelevt=(/Firefox/i.test(navigator.userAgent))? "DOMMouseScroll" : "mousewheel" if (slideshow.attachEvent) slideshow.attachEvent("on"+mousewheelevt, rotateimage) else if (slideshow.addEventListener) slideshow.addEventListener(mousewheelevt, rotateimage, false) </script>