Difference between revisions of "Team:Hong Kong-CUHK"

Line 186: Line 186:
 
}
 
}
  
/* Next & previous buttons */
+
 
.prev, .next {
+
.flashingprev, .flashingnext{
  cursor: pointer;
+
    background:red;
 +
    cursor: pointer;
 
   position: absolute;
 
   position: absolute;
 
   top: 50%;
 
   top: 50%;
Line 194: Line 195:
 
   padding: 16px;
 
   padding: 16px;
 
   margin-top: -22px;
 
   margin-top: -22px;
   color: white;
+
   color: #fff;
 
   font-weight: bold;
 
   font-weight: bold;
 
   font-size: 80px;
 
   font-size: 80px;
 
   transition: 0.6s ease;
 
   transition: 0.6s ease;
 
   border-radius: 0 3px 3px 0;
 
   border-radius: 0 3px 3px 0;
 +
    animation-name: flash;
 +
    animation-duration: 1.8s;
 +
    animation-timing-function: linear;
 +
    animation-iteration-count: infinite;
 +
 +
    /* Chrome 4+, Safari 4+, Opera 15+ */
 +
    -webkit-animation-name: flash;
 +
    -webkit-animation-duration: 0.7s;
 +
    -webkit-animation-timing-function: linear;
 +
    -webkit-animation-iteration-count: infinite;
 +
  -webkit-box-shadow: 0 0 33px #B20000;
 +
 
 +
    /* Firefox 5+ */
 +
    -moz-animation-name: flash;
 +
    -moz-animation-duration: 0.7s;
 +
    -moz-animation-timing-function: linear;
 +
    -moz-animation-iteration-count: infinite;
 +
  -moz-box-shadow: 0 0 3px #B20000;
 
}
 
}
 +
 +
@keyframes flash { 
 +
    0% { opacity: 1.0 }
 +
    50% { opacity: 0.5 }
 +
    100% { opacity: 1.0 }
 +
}
 +
 +
/* Chrome 4+, Safari 4+, Opera 15+ */
 +
@-webkit-keyframes flash { 
 +
    0% { opacity: 1.0 }
 +
    50% { opacity: 0.5 }
 +
    100% { opacity: 1.0 }
 +
}
 +
 +
/* Firefox 5+ */
 +
@-moz-keyframes flash { 
 +
    0% { opacity: 1.0 }
 +
    50% { opacity: 0.5 }
 +
    100% { opacity: 1.0 }
 +
}
 +
 +
  
 
/* Position the "next button" to the right */
 
/* Position the "next button" to the right */
.next {
+
.flashingnext {
 
   right: 0;
 
   right: 0;
 
   border-radius: 3px 0 0 3px;
 
   border-radius: 3px 0 0 3px;
Line 354: Line 395:
 
<div class="mySlides fade">
 
<div class="mySlides fade">
 
   <div class="numbertext">1 / 4</div>
 
   <div class="numbertext">1 / 4</div>
   <img src="https://static.igem.org/mediawiki/2017/c/c3/Cuhk_secondpage.PNG" width="1200" height="650">
+
   <img src="https://static.igem.org/mediawiki/2017/c/c3/Cuhk_secondpage.PNG" width="100%" >
 
    
 
    
 
</div>
 
</div>
Line 360: Line 401:
 
<div class="mySlides fade">
 
<div class="mySlides fade">
 
   <div class="numbertext">2 / 4</div>
 
   <div class="numbertext">2 / 4</div>
   <img src="https://static.igem.org/mediawiki/2017/7/77/Cuhk_thirdpage.PNG" width="1200" height="650">
+
   <img src="https://static.igem.org/mediawiki/2017/7/77/Cuhk_thirdpage.PNG" width="100%" >
 
    
 
    
 
</div>
 
</div>
Line 366: Line 407:
 
<div class="mySlides fade">
 
<div class="mySlides fade">
 
   <div class="numbertext">3 / 4</div>
 
   <div class="numbertext">3 / 4</div>
   <img src="https://static.igem.org/mediawiki/2017/2/27/Cuhk_forthpage.PNG" width="1200" height="650">
+
   <img src="https://static.igem.org/mediawiki/2017/2/27/Cuhk_forthpage.PNG" width="100%" >
 
    
 
    
 
</div>
 
</div>
Line 372: Line 413:
 
<div class="mySlides fade">
 
<div class="mySlides fade">
 
   <div class="numbertext">4 / 4</div>
 
   <div class="numbertext">4 / 4</div>
   <img src="https://static.igem.org/mediawiki/2017/6/6b/Cuhk_finalpage.PNG" width="1200" height="650">
+
   <img src="https://static.igem.org/mediawiki/2017/6/6b/Cuhk_finalpage.PNG" width="100%" >
 
   <div class="text">Caption Five</div>
 
   <div class="text">Caption Five</div>
 
</div>
 
</div>
  
<a class="prev" onclick="plusSlides(-1)">&#10094;</a>
+
<span class="flashingprev" onclick="plusSlides(-1)">&#10094;</span>
<a class="next" onclick="plusSlides(1)">&#10095;</a>
+
<span class="flashingnext" onclick="plusSlides(1)">&#10095;</span>
 +
 
  
 
</div>
 
</div>

Revision as of 16:42, 17 July 2017

1 / 4
2 / 4
3 / 4
4 / 4
Caption Five