Line 66: | Line 66: | ||
<!-- Full-width images with number and caption text --> | <!-- Full-width images with number and caption text --> | ||
− | <div class=" | + | <div class="mySlides2 fade"> |
<table style="width:98%"> | <table style="width:98%"> | ||
Line 83: | Line 83: | ||
</div> | </div> | ||
− | <div class=" | + | <div class="mySlides2 fade"> |
<table style= "width:98%"> | <table style= "width:98%"> | ||
Line 192: | Line 192: | ||
slides[slideIndex-1].style.display = "block"; | slides[slideIndex-1].style.display = "block"; | ||
dots[slideIndex-1].className += " active"; | dots[slideIndex-1].className += " active"; | ||
+ | } | ||
+ | |||
+ | |||
+ | var slideIndex2 = 1; | ||
+ | showSlides2(slideIndex); | ||
+ | |||
+ | // Next/previous controls | ||
+ | function plusSlides2(n) { | ||
+ | showSlides2(slideIndex2 += n); | ||
+ | } | ||
+ | |||
+ | // Thumbnail image controls | ||
+ | function currentSlide2(n) { | ||
+ | showSlides2(slideIndex2 = n); | ||
+ | } | ||
+ | |||
+ | function showSlides2(n) { | ||
+ | var i; | ||
+ | var slides = document.getElementsByClassName("mySlides2"); | ||
+ | var dots = document.getElementsByClassName("dot"); | ||
+ | if (n > slides.length) {slideIndex = 1} | ||
+ | if (n < 1) {slideIndex2 = slides.length} | ||
+ | for (i = 0; i < slides.length; i++) { | ||
+ | slides[i].style.display = "none"; | ||
+ | } | ||
+ | for (i = 0; i < dots.length; i++) { | ||
+ | dots[i].className = dots[i].className.replace(" active", ""); | ||
+ | } | ||
+ | slides[slideIndex2-1].style.display = "block"; | ||
+ | dots[slideIndex2-1].className += " active"; | ||
} | } | ||
</script> | </script> |
Revision as of 20:06, 16 October 2018