Team:NCTU Formosa/source/head-index

From 2014.igem.org

(Difference between revisions)
 
(49 intermediate revisions not shown)
Line 2: Line 2:
<style>
<style>
.wordbox p{
.wordbox p{
-
  color: lime;
 
   font-family: "Courier";
   font-family: "Courier";
   font-size: 20px;
   font-size: 20px;
   margin: 10px 0 0 10px;
   margin: 10px 0 0 10px;
-
  white-space: nowrap;
 
   overflow: hidden;
   overflow: hidden;
-
  width: 30em;
+
-
  animation: type 4s steps(60, end);
+
}
}
-
 
+
.attach{
-
.wordbox p:nth-child(2){
+
margin-left: 30%;
-
  animation: type2 8s steps(60, end);
+
position: relative;
 +
z-index: 2;
 +
top:50%;
 +
cursor:pointer;
}
}
Line 19: Line 19:
   color: lime;
   color: lime;
   text-decoration: none;
   text-decoration: none;
-
}
 
-
 
-
.wordbox span{
 
-
  animation: blink 1s infinite;
 
-
}
 
-
 
-
@keyframes type{
 
-
  from { width: 0; }
 
-
}
 
-
 
-
@keyframes type2{
 
-
  0%{width: 0;}
 
-
  50%{width: 0;}
 
-
  100%{ width: 100; }
 
-
}
 
-
 
-
@keyframes blink{
 
-
  to{opacity: .0;}
 
-
}
 
-
 
-
::selection{
 
-
  background: black;
 
}
}
Line 146: Line 124:
     padding: 40px 0 0 0;
     padding: 40px 0 0 0;
     height: 90px;
     height: 90px;
-
     font-family: 'Open Sans', Arial, sans-serif;
+
     //font-family: 'Open Sans', Arial, sans-serif;
     text-shadow:
     text-shadow:
         0 0 1px #fff,
         0 0 1px #fff,
Line 158: Line 136:
     margin: 0 30px;
     margin: 0 30px;
     font-size: 12px;
     font-size: 12px;
-
    border-top: 1px solid rgba(255,255,255,0.5);
+
 
}
}
   
   
Line 223: Line 201:
background:black;
background:black;
overflow-x: none;
overflow-x: none;
-
font-family: Open Sans;
+
//font-family: Open Sans;
}
}
#footer-box {
#footer-box {
Line 237: Line 215:
position: relative;
position: relative;
overflow: hidden;
overflow: hidden;
-
cursor: url(https://2014.igem.org/File:NCTU_Formosa_2014_Cursor_Bluerayaim.png), crosshair;
+
 
}
}
#description {
#description {
background-image: url(https://static.igem.org/mediawiki/2014/5/5a/NCTU_wiki_Backdround.jpg);
background-image: url(https://static.igem.org/mediawiki/2014/5/5a/NCTU_wiki_Backdround.jpg);
-
 
-
cursor: url(https://2014.igem.org/File:NCTU_Formosa_2014_Cursor_Bluerayaim.png), crosshair;
 
background-position: center top;
background-position: center top;
 +
margin-bottom:10pt;
}
}
#sitemap {
#sitemap {
background-image: url(https://static.igem.org/mediawiki/2014/6/60/BackgroundNCTU.png);
background-image: url(https://static.igem.org/mediawiki/2014/6/60/BackgroundNCTU.png);
z-index:4;
z-index:4;
-
background-size: contain;
+
background-size: cover;
background-repeat: no-repeat;
background-repeat: no-repeat;
min-height: 650px!important;
min-height: 650px!important;
Line 290: Line 267:
}
}
#description .wordbox {
#description .wordbox {
-
margin-top:300px;
+
top: -17%;
-
padding:20px;
+
padding:30pt;
font-weight:300;
font-weight:300;
-
width:48%;
+
width:98%;
font-family: Open Sans;
font-family: Open Sans;
font-size: 18px;
font-size: 18px;
text-align:justify;
text-align:justify;
text-justify:inter-word;
text-justify:inter-word;
-
text-indent: 50px;
+
  background-color: rgba(156, 156, 156, 0.76);
-
    background-color: rgba(152, 152, 152, 1);
+
     border-radius: 30px;
     border-radius: 30px;
-
     opacity: 0.85;
+
     opacity: 0;
float:left;
float:left;
 +
color: white;
 +
z-index: 1;
 +
position: relative;
 +
box-shadow: 0px 0px 12px 7px #B7600B;
 +
letter-spacing: 1px;
 +
}
}
-
#description .moviebox {
+
 
-
margin-top:300px;
+
-
padding:20px;
+
-
font-weight:300;
+
-
width:48%;
+
-
font-family: Open Sans;
+
-
font-size: 18px;
+
-
float:right;
+
-
text-align:justify;
+
-
text-justify:inter-word;
+
-
text-indent: 50px;
+
-
    background-color: rgba(152, 152, 152, 1);
+
-
    border-radius: 30px;
+
-
    opacity: 0.85;
+
-
}
+
-
margin-bottom:30px;
+
}
}
#description .wordbox p{
#description .wordbox p{
Line 325: Line 292:
padding-left:30px;
padding-left:30px;
padding-right:30px;
padding-right:30px;
-
color:#FFFFFF
 
}
}
Line 680: Line 646:
   });
   });
});
});
 +
</script>
 +
 +
<script>
 +
$(document).ready(function(){
 +
  $(".attach").click(function(){
 +
    $(".wordbox").animate({
 +
      opacity:'1'
 +
 +
    });
 +
$(".attach").animate({
 +
      opacity:'0 '
 +
    });
 +
 +
  });
 +
});
 +
 +
</script>
</script>

Latest revision as of 03:55, 18 October 2014