Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* Any JavaScript here will be loaded for all users on every page load. */ var coll = document.getElementsByClassName("collapsible"); var i; for (i = 0; i < coll.length; i++) { coll[i].addEventListener("click", function() { this.classList.toggle("active"); var content = this.nextElementSibling; $(content).toggle('fast'); }); } function setMainImage(imageHtml) { var mainImageDiv = document.querySelector('.mainImage'); mainImageDiv.innerHTML = imageHtml; } function addClickEventToImages() { var images = document.querySelectorAll('.carousel .dpImage'); images.forEach(function(image, index) { image.addEventListener('click', function() { setMainImage(this.innerHTML); currentIndex = index; // Update the current index }); }); } var currentIndex = 0; function rotateImages() { var images = document.querySelectorAll('.carousel .dpImage'); setInterval(function() { if (currentIndex >= images.length) { currentIndex = 0; } setMainImage(images[currentIndex].innerHTML); currentIndex++; }, 10000); // Rotates every 10000 milliseconds (10 seconds) } // Call the functions when the window loads window.onload = function() { addClickEventToImages(); rotateImages(); setMainImage(document.querySelector('.carousel .dpImage').innerHTML); // Set the first image as the default };