Difference between revisions of "Team:ShanghaitechChina"

Line 2: Line 2:
 
<html>
 
<html>
 
<style>
 
<style>
 +
html, body, div, span, p, a, del, em, img, ol, ul, li, fieldset, form, label {
 +
margin: 0;
 +
padding: 0;
 +
border: 0;
 +
font-size: 100%;
 +
font: inherit;
 +
vertical-align: baseline;
 +
}
  
 +
article, aside, details, figcaption, figure,
 +
footer, header, hgroup, menu, nav, section {
 +
display: block;
 +
}
 +
 +
html, body {
 +
line-height: 1;
 +
min-height:100%; font-size:18px;
 +
/*font-family: 'Droid Sans', sans-serif;*/
 +
 +
}
 +
 +
body {
 +
background: #eeeeee;
 +
background: -webkit-linear-gradient(top, #eeeeee, #cccccc 100%);
 +
background: -moz-linear-gradient(top, #eeeeee, #cccccc 100%);
 +
background: -o-linear-gradient(top, #eeeeee, #cccccc 100%);
 +
background: -ms-linear-gradient(top, #eeeeee, #cccccc 100%);
 +
background: linear-gradient(top, #eeeeee, #cccccc 100%);
 +
background-attachment:fixed;
 +
}
 +
 +
h1 {
 +
font-size:24px;
 +
margin:0;
 +
}
 +
 +
h1 > small {
 +
text-align:right;
 +
display:inline-block;
 +
font-size:.71em;
 +
text-indent:15em;
 +
color:#444;
 +
}
 +
 +
h2 {
 +
color:inherit;
 +
font-size:18px;
 +
margin:2em 0 1em 0;
 +
}
 +
 +
h2:first-child {margin-top:0;}
 +
 +
h3 {
 +
color:#333;
 +
font-size:1.41em;
 +
margin:1em 0;
 +
}
 +
 +
h4 {
 +
color:#444;
 +
font-size:1.11em;
 +
margin:1em 0;
 +
}
 +
 +
 +
 +
html, body {
 +
width:100%;
 +
height:100%;
 +
padding:0;
 +
margin:0;
 +
overflow-x:hidden;
 +
}
 +
 +
.skrollable {
 +
/*
 +
* First-level skrollables are positioned relative to window
 +
*/
 +
position:fixed;
 +
 +
/*
 +
* Skrollables by default have a z-index of 100 in order to make it easy to position elements in front/back without changing each skrollable
 +
*/
 +
z-index:100;
 +
}
 +
 +
.skrollr-mobile .skrollable {
 +
/*
 +
May cause issues on Android default browser (see #331 on GitHub).
 +
*/
 +
position:absolute;
 +
}
 +
 +
.skrollable .skrollable {
 +
/*
 +
* Second-level skrollables are positioned relative their parent skrollable
 +
*/
 +
position:absolute;
 +
}
 +
 +
.skrollable .skrollable .skrollable {
 +
/*
 +
* Third-level (and below) skrollables are positioned static
 +
*/
 +
position:static;
 +
}
 +
 +
 +
#progress {
 +
height:4px;
 +
background:#444;
 +
bottom:0;
 +
z-index:200;
 +
}
 +
 +
#bg1, #bg2, #bg3, #bg4 {
 +
z-index:50;
 +
top:0;
 +
left:0;
 +
width:100%;
 +
height:100%;
 +
background:url("https://static.igem.org/mediawiki/2016/1/12/Bubbles_back.png") repeat 0 0;
 +
}
 +
 +
#bg2 {
 +
z-index:49;
 +
background-image:url("https://static.igem.org/mediawiki/2016/f/fd/Bubbles2.png");
 +
}
 +
 +
#bg3 {
 +
z-index:48;
 +
background-image:url("https://static.igem.org/mediawiki/2016/2/23/Bubbles3.png");
 +
}
 +
#bg4 {
 +
z-index:48;
 +
background-image:url("https://static.igem.org/mediawiki/2016/b/b3/Bubbles4.png");
 +
}
 +
 +
#intro {
 +
width:80%;
 +
left:50%;
 +
top:1em;
 +
margin-left:-40%;
 +
padding:2em;
 +
background:#fff;
 +
text-align:center;
 +
border-radius:1em;
 +
 +
-webkit-transform-origin:0 0;
 +
-moz-transform-origin:0 0;
 +
-ms-transform-origin:0 0;
 +
-o-transform-origin:0 0;
 +
transform-origin:0 0;
 +
 +
-webkit-box-sizing: border-box;
 +
-moz-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
 +
 +
#intro .arrows {
 +
font-size:2em;
 +
color:#09f;
 +
}
 +
 +
#transform {
 +
width:70%;
 +
left:50%;
 +
top:20%;
 +
margin-left:-35%;
 +
text-align:center;
 +
font-size:150%;
 +
 +
.transform-origin(50%, 50%);
 +
}
 +
 +
#properties {
 +
width:100%;
 +
height:100%;
 +
padding-top:10%;
 +
text-align:center;
 +
 +
-webkit-box-sizing: border-box;
 +
-moz-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
 +
 +
 +
 +
#end {
 +
width:60%;
 +
left:20%;
 +
height:80%;
 +
padding:3em;
 +
border:0 solid #666;
 +
text-align:center;
 +
 +
-webkit-box-sizing: border-box;
 +
-moz-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
 +
.content {
 +
    background-color: white;
 +
    border: 1px solid #cccccc;
 +
    border-radius: 10px;
 +
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35);
 +
    color: #3d3d3d;
 +
    font-family: Tahoma;
 +
    font-size: 14px;
 +
    margin-left: 5%;
 +
    margin-top: 50px;
 +
    padding: 15px 60px;
 +
    width: 80%;
 +
}
 +
#easing {
 +
top:10%;
 +
width:50%;
 +
z-index:101;
 +
}
 +
 +
.drop {
 +
background:#09f;
 +
font-weight:bold;
 +
padding:1em;
 +
}
 +
#easing_wrapper {
 +
width:100%;
 +
height:100%;
 +
}
 
.tiny{
 
.tiny{
 
   cursor:pointer;
 
   cursor:pointer;
Line 14: Line 241:
 
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
 
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
 
<title>ShanghaiTech University</title>
 
<title>ShanghaiTech University</title>
−
    <script src="https://2016.igem.org/Template:ShanghaitechChina/js/skollr?action=raw&ctype=text/javascript"></script>
+
    <script src="https://2016.igem.org/Template:ShanghaitechChina/js/skollr?action=raw&ctype=text/javascript"></script>
 
     <link rel="stylesheet" href="https://2016.igem.org/Template:ShanghaitechChina/css/bootstrap?action=raw&ctype=text/css">
 
     <link rel="stylesheet" href="https://2016.igem.org/Template:ShanghaitechChina/css/bootstrap?action=raw&ctype=text/css">
−
    <link rel="stylesheet" href="https://2016.igem.org/Template:ShanghaitechChina/css/test1?action=raw&ctype=text/css">
 
−
    <link rel="stylesheet" href="https://2016.igem.org/Template:ShanghaitechChina/css/test2?action=raw&ctype=text/css">
 
 
     <script src="https://2016.igem.org/Template:ShanghaitechChina/js/jquery?action=raw&ctype=text/javascript"></script>
 
     <script src="https://2016.igem.org/Template:ShanghaitechChina/js/jquery?action=raw&ctype=text/javascript"></script>
 
     <script src="https://2016.igem.org/Template:ShanghaitechChina/js/bootstrap?action=raw&ctype=text/javascript"></script>
 
     <script src="https://2016.igem.org/Template:ShanghaitechChina/js/bootstrap?action=raw&ctype=text/javascript"></script>
Line 23: Line 248:
 
</head>
 
</head>
 
<body>
 
<body>
−
 
 
<div id="bg1" data-0="background-position:0px 0px;" data-end="background-position:-500px -10000px;"></div>
 
<div id="bg1" data-0="background-position:0px 0px;" data-end="background-position:-500px -10000px;"></div>
−
</div></div>
 
 
<div id="bg2" data-0="background-position:0px 0px;" data-end="background-position:-500px -8000px;"></div>
 
<div id="bg2" data-0="background-position:0px 0px;" data-end="background-position:-500px -8000px;"></div>
 
<div id="bg3" data-0="background-position:0px 0px;" data-end="background-position:-500px -6000px;"></div>
 
<div id="bg3" data-0="background-position:0px 0px;" data-end="background-position:-500px -6000px;"></div>
Line 61: Line 284:
  
 
</div>
 
</div>
 +
 
<script>
 
<script>
−
var s = skrollr.init();
 
 
$('.tiny').click(function(){
 
$('.tiny').click(function(){
 
        
 
        
Line 75: Line 298:
 
     }
 
     }
 
});
 
});
−
 
+
var s = skrollr.init({
 +
//edgeStrategy: 'set',
 +
easing: {
 +
WTF: Math.random,
 +
inverted: function(p) {
 +
return 1-p;
 +
}
 +
}
 +
});
 
$('.down233').click(function(){
 
$('.down233').click(function(){
 
$(this).toggleClass('dropdown open');
 
$(this).toggleClass('dropdown open');
 
$(this).toggleClass('dropdown');
 
$(this).toggleClass('dropdown');
 
});
 
});
−
 
 
</script>
 
</script>
  

Revision as of 08:34, 17 October 2016

igem2016:ShanghaiTech

ShanghaiTech University