Difference between revisions of "Template:US AFRL CarrollHS SlideShow"

Line 7: Line 7:
 
   <div class="mySlides fade">
 
   <div class="mySlides fade">
 
     <div class="numbertext">1 / 5</div>
 
     <div class="numbertext">1 / 5</div>
−
     <img src="https://static.igem.org/mediawiki/2017/b/bb/US_AFRL_CarrollHS_TeamPic.jpeg" style="width:100%" style="height:200px">
+
     <img src="https://static.igem.org/mediawiki/igem.org/f/f1/Team_Photo_in_Front_of_a_Airplane.jpg" style="width:100%">
−
     <div class="text">The Whole Student Team!</div>
+
     <div class="SlideShowText">The Whole Student Team!</div>
 
   </div>
 
   </div>
  
Line 14: Line 14:
 
     <div class="numbertext">2 / 5</div>
 
     <div class="numbertext">2 / 5</div>
 
     <img src="https://static.igem.org/mediawiki/igem.org/a/a7/US_AFRL_CARROLLHS_JonahRockingIT.JPG" style="width:100%">
 
     <img src="https://static.igem.org/mediawiki/igem.org/a/a7/US_AFRL_CARROLLHS_JonahRockingIT.JPG" style="width:100%">
−
     <div class="text">Jonah in front of the B-2 Bomber</div>
+
     <div class="SlideShowText">Jonah in front of the B-2 Bomber</div>
 
   </div>
 
   </div>
 
    
 
    
Line 20: Line 20:
 
     <div class="numbertext">3 / 5</div>
 
     <div class="numbertext">3 / 5</div>
 
     <img src="https://static.igem.org/mediawiki/2017/f/f3/US_AFRL_CARROLLHS_RHLAB.JPG" style="width:100%">
 
     <img src="https://static.igem.org/mediawiki/2017/f/f3/US_AFRL_CARROLLHS_RHLAB.JPG" style="width:100%">
−
     <div class="text">RH Lab Cheesin'</div>
+
     <div class="SlideShowText">RH Lab Cheesin'</div>
 
   </div>
 
   </div>
 
    
 
    
Line 26: Line 26:
 
     <div class="numbertext">4 / 5</div>
 
     <div class="numbertext">4 / 5</div>
 
     <img src="https://static.igem.org/mediawiki/igem.org/6/68/US_AFRL_CARROLLHS_BOWDOWNTOTHEMASTAH.JPG" style="width:100%">
 
     <img src="https://static.igem.org/mediawiki/igem.org/6/68/US_AFRL_CARROLLHS_BOWDOWNTOTHEMASTAH.JPG" style="width:100%">
−
     <div class="text">RX Bows Down to Mentor Chia!</div>
+
     <div class="SlideShowText">RX Bows Down to Mentor Chia!</div>
 
   </div>
 
   </div>
 
    
 
    
Line 33: Line 33:
 
     <div class="numbertext">5 / 5</div>
 
     <div class="numbertext">5 / 5</div>
 
     <img src="https://static.igem.org/mediawiki/igem.org/3/3b/US_AFRL_CARROLLHS_Area51BABY.JPG" style="width:100%">
 
     <img src="https://static.igem.org/mediawiki/igem.org/3/3b/US_AFRL_CARROLLHS_Area51BABY.JPG" style="width:100%">
−
     <div class="text">Area 51 at the Air Force Museum</div>
+
     <div class="SlideShowText">Area 51 at the Air Force Museum</div>
 
   </div>
 
   </div>
 
    
 
    
Line 56: Line 56:
 
/* Slideshow container - Change dimensions of the Border Box */
 
/* Slideshow container - Change dimensions of the Border Box */
 
.slideshow-container {
 
.slideshow-container {
−
   max-height: 400px;
+
   max-width: 500px;
−
  width: 100%;
+
 
   position: relative;
 
   position: relative;
 
   margin: auto;
 
   margin: auto;
−
  border: 10px;
 
 
}
 
}
  
Line 95: Line 93:
  
 
/* Caption text */
 
/* Caption text */
−
.text {
+
.SlideShowText {
 
   color: #f2f2f2;
 
   color: #f2f2f2;
 
   font-size: 15px;
 
   font-size: 15px;
Line 176: Line 174:
 
   dots[slideIndex-1].className += " active";
 
   dots[slideIndex-1].className += " active";
 
}
 
}
 +
 +
var slideIndex = 0;
 +
showSlides();
 +
 +
function showSlides() {
 +
    var i;
 +
    var slides = document.getElementsByClassName("mySlides");
 +
    for (i = 0; i < slides.length; i++) {
 +
        slides[i].style.display = "none";
 +
    }
 +
    slideIndex++;
 +
    if (slideIndex> slides.length) {slideIndex = 1}
 +
    slides[slideIndex-1].style.display = "block";
 +
    setTimeout(showSlides, 4000); // Change image every X000 seconds
 +
}
 +
 
</script>
 
</script>
  

Revision as of 17:52, 7 July 2017

Slideshow

1 / 5
The Whole Student Team!
2 / 5
Jonah in front of the B-2 Bomber
3 / 5
RH Lab Cheesin'
4 / 5
RX Bows Down to Mentor Chia!
5 / 5
Area 51 at the Air Force Museum