Difference between revisions of "Team:ZJU-China"

Line 41: Line 41:
  
 
<style>
 
<style>
 +
 
.container0 {
 
.container0 {
 
     width: 100%;
 
     width: 100%;
Line 57: Line 58:
 
.bedroom-floor {
 
.bedroom-floor {
 
     height: 100%;
 
     height: 100%;
     background: rgb(255,169,181)
+
      
 
}
 
}
 
.floor-inner {
 
.floor-inner {
     position: absolute;
+
      
 
     vertical-align: middle;
 
     vertical-align: middle;
     border: 0;
+
     text-align: center;
    -ms-interpolation-mode: bicubic;
+
     width: 100%;
     width: 1000px;
+
 
     height: 94%;
 
     height: 94%;
 
     min-height: 400px;
 
     min-height: 400px;
Line 72: Line 72:
 
}
 
}
  
img .fone {
+
.fone {
     max-width: 1000px;
+
     position: absolute;
     max-height: 130px;
+
     width: 80%;
    height: 200%;
+
height: auto;
     top: 20%;
+
max-width: 100%;
     left: 30%;
+
max-height: 100%;
 +
   
 +
     top: 15%;
 +
     left: 10%;
 
      
 
      
 
}
 
}
 +
.ftwo {
 +
    position: absolute;
 +
    width: 60%;
 +
height: auto;
 +
max-width: 100%;
 +
max-height: 100%;
 +
    top: 15%;
 +
    left: 20%;
 +
    box-shadow: 0 12px 15px rgba(0,0,0,.10);
 +
   
 +
}
 +
.fthree {
 +
    position: absolute;
 +
    width: 60%;
 +
height: auto;
 +
max-width: 100%;
 +
max-height: 100%;
 +
    top: 15%;
 +
    left: 20%;
 +
 +
}
 +
 +
.ffour {
 +
    position: absolute;
 +
    width: 15%;
 +
height: auto;
 +
max-width: 100%;
 +
max-height: 100%;
 +
    top: 15%;
 +
    left: 55%;
 +
 +
}
 +
.ffive {
 +
    position: absolute;
 +
    width: 30%;
 +
height: auto;
 +
max-width: 100%;
 +
max-height: 100%;
 +
    top: 15%;
 +
    left: 30%;
 +
 +
}
 +
  
 
.bathroom-wall {
 
.bathroom-wall {
Line 312: Line 358:
 
           >
 
           >
 
            
 
            
             <!-- Scene 1: Drinking -->
+
             <!-- Scene 1 -->
 
             <div class="scene"
 
             <div class="scene"
 
                 data-2700="top: 0%"  
 
                 data-2700="top: 0%"  
Line 323: Line 369:
 
                 <div class="bedroom-floor">
 
                 <div class="bedroom-floor">
 
                       <div class="floor-inner">
 
                       <div class="floor-inner">
                         <img src="https://static.igem.org/mediawiki/2019/3/38/T--Fudan--Home70.png"  class="fone"
+
                         <img src="assets/img/home/fig1.png"  class="fone"
 
                        
 
                        
 
                         data-="display:none;"
 
                         data-="display:none;"
                         data-500="display:block; opacity:0;"  
+
                         data-100="display:block; opacity:0;"  
                         data-1000="display:block; opacity:1; "
+
                         data-700="display:block; opacity:1; "
 
                         data-3600="display:block; opacity:1; "
 
                         data-3600="display:block; opacity:1; "
 
                         data-3700="display:block; opacity:0; "
 
                         data-3700="display:block; opacity:0; "
 
                         >
 
                         >
 +
                        <img src="assets/img/home/fig2.png"  class="ftwo"
 +
                     
 +
                        data-="display:none;"
 +
                        data-600="display:block; opacity:1;top:100%;"
 +
                        data-1000="display:block; opacity:1; top:25%;"
 +
                        data-1300="display:block; opacity:1; top:25%;"
 +
                        data-1700="display:block; opacity:1; top:-100%;"
 +
                       
 +
                        >
 +
                        <img src="assets/img/home/fig2.gif"  class="fthree"
 +
                     
 +
                        data-="display:none;"
 +
                        data-1200="display:block; opacity:1;top:120%;"
 +
                        data-2000="display:block; opacity:1; top:40%;"
 +
                       
 +
                       
 +
                       
 +
                        >
 +
                        <img src="assets/img/home/fig3.png"  class="ffour"
 +
                     
 +
                        data-="display:none;"
 +
                        data-1700="display:block; opacity:1;top:120%;"
 +
                        data-2300="display:block; opacity:1; top:50%;"
 +
                        >
 +
                        <img src="assets/img/home/fig4.png"  class="ffive"
 +
                     
 +
                        data-="display:none;"
 +
                        data-2300="display:block; opacity:1;top:100%;"
 +
                        data-2500="display:block; opacity:1; top:20%;"
 +
                        >
 +
                       
 
                          
 
                          
 
                          
 
                          

Revision as of 04:13, 26 October 2020

ZJU-China