Team:AUC TURKEY

From 2014hs.igem.org

(Difference between revisions)
(Undo revision 28239 by Alihancelikcan (talk))
 
(50 intermediate revisions not shown)
Line 2: Line 2:
<html>
<html>
<head>
<head>
 +
    <meta name="viewport" content="width=device-width">
<meta charset="UTF-8" />
<meta charset="UTF-8" />
         <meta name="description" content="Animated Text and Icon Menu with jQuery" />
         <meta name="description" content="Animated Text and Icon Menu with jQuery" />
Line 10: Line 11:
<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&v1' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&v1' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Wire+One&v1' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Wire+One&v1' rel='stylesheet' type='text/css' />
-
</head>
+
 
-
<head>
+
<script" type="text/javascript">
-
<script type="text/javascript">
+
</script>
</script>
-
</head>
+
<style type="text/css">
 +
.divider {
 +
  height: 1px;
 +
  background: #000;
 +
  background: -webkit-linear-gradient(left, rgb(255,255,255) 0%, rgb(50,50,50) 50%, rgb(255,255,255) 100%);
 +
}
 +
.divider.light {
 +
  background: #fff;
 +
  background: -webkit-linear-gradient(left, rgb(90,90,90) 0%, rgb(255,255,255) 50%, rgb(90,90,90) 100%);
 +
}
 +
 +
.divider.light:before {
 +
  position:relative;
 +
  float:left;
 +
  background: linear-gradient(to right, rgba(100, 100, 100, 0), rgba(100, 100, 100, 1) 50%);
 +
  margin-top:2px;
 +
  width:50%;
 +
  height:1px;
 +
  content:"";
 +
}
 +
 +
.divider.light:after {
 +
  position:relative;
 +
  float:right;
 +
  background: linear-gradient(to left, rgba(100, 100, 100, 0), rgba(100, 100, 100, 1) 50%);
 +
  margin-top:2px;
 +
  width:50%;
 +
  height:1px;
 +
  content:""; 
 +
}
 +
 +
.divider:before {
 +
  position:relative;
 +
  float:left;
 +
  background: linear-gradient(to right, rgba(200, 200, 200, 0), rgba(200, 200, 200, 1) 50%);
 +
  margin-top:2px;
 +
  width:50%;
 +
  height:1px;
 +
  content:"";
 +
}
 +
 +
.divider:after {
 +
  position:relative;
 +
  float:right;
 +
  background: linear-gradient(to left, rgba(100, 200, 200, 0), rgba(200, 200, 200, 1) 50%);
 +
  margin-top:2px;
 +
  width:50%;
 +
  height:1px;
 +
  content:""; 
 +
}
 +
 +
</style>
<style type="text/css">
<style type="text/css">
#animatedmenu
#animatedmenu
Line 26: Line 77:
</style>
</style>
<style type="text/css">
<style type="text/css">
 +
label, a {
label, a {
   cursor: pointer;
   cursor: pointer;
Line 31: Line 83:
}
}
-
* {
+
article
-
   -moz-box-sizing: border-box;
+
{
-
  -webkit-box-sizing: border-box;
+
   width:87.8%;
-
  box-sizing: border-box;
+
}
}
Line 43: Line 94:
#slider {
#slider {
-
  margin: 0 auto;
+
margin: 0 auto;
 +
 
}
}
Line 234: Line 286:
     -ms-transform: scale(0.6);
     -ms-transform: scale(0.6);
     transform: scale(0.6);
     transform: scale(0.6);
-
  }
 
-
}
 
-
@media only screen and (min-width: 850px) {
 
-
  body {
 
-
    padding: 0 80px;
 
   }
   }
}
}
Line 249: Line 296:
</head>
</head>
<body>
<body>
-
<p>sdasd</p>
+
<article id="slider">
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
+
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js"></script>
+
-
<script type="text/javascript" src="https://2014hs.igem.org/Team:AUC_TURKEY/jquery.easing.1.3.js?action=raw&ctype=text/javascript"></script>
+
-
<script type="text/javascript" src="https://2014hs.igem.org/Team:AUC_TURKEY/jquery.iconmenu.js?action=raw&ctype=text/javascript"></script>
+
-
<script type="text/javascript">
+
-
$(function() {
+
-
$('#sti-menu').iconmenu({
+
-
animMouseenter : {
+
-
'mText' : {speed : 200, easing : 'easeOutExpo', delay : 250, dir : 1},
+
-
'sText' : {speed : 200, easing : 'easeOutExpo', delay : 0, dir : 1},
+
-
'icon'  : {speed : 200, easing : 'easeOutExpo', delay : 500, dir : 1}
+
-
},
+
-
animMouseleave : {
+
-
'mText' : {speed : 200, easing : 'easeInExpo', delay : 250, dir : 1},
+
-
'sText' : {speed : 200, easing : 'easeInExpo', delay : 500, dir : 1},
+
-
'icon'  : {speed : 200, easing : 'easeInExpo', delay : 0, dir : 1}
+
-
}
+
-
});
+
-
});
+
-
</script>
+
-
</body>
+
-
<body>
+
-
<html lang="en">
+
-
 
+
-
  <head>
+
-
    <meta charset="utf-8" />
+
-
    <meta name="viewport" content="width=device-width">
+
-
  </head>
+
-
 
+
-
  <body>
+
-
   
+
-
    <article id="slider">
+
        
        
       <!-- Slider Setup -->
       <!-- Slider Setup -->
Line 300: Line 315:
              
              
             <article>
             <article>
-
               <img src="http://placehold.it/900x400/FFE4C4" />
+
               <img src="https://static.igem.org/mediawiki/2014hs/7/78/900400.png">
             </article>
             </article>
              
              
             <article>
             <article>
-
               <img src="http://placehold.it/900x400/556B2F" />
+
               <img src="https://static.igem.org/mediawiki/2014hs/b/b6/900x400-2.jpg">
             </article>
             </article>
              
              
             <article>
             <article>
-
               <img src="http://placehold.it/900x400/8B0000" />
+
               <img src="https://static.igem.org/mediawiki/2014hs/0/0e/HumanPractices.png">
             </article>
             </article>
              
              
             <article>
             <article>
-
               <img src="http://placehold.it/900x400/1E90FF" />
+
               <img src="https://static.igem.org/mediawiki/2014hs/3/3c/Teamselfie.png">
             </article>
             </article>
              
              
             <article>
             <article>
-
               <img src="http://placehold.it/900x400/FFA07A" />
+
               <img src="https://static.igem.org/mediawiki/2014hs/6/6f/Resultauc.png">
             </article>
             </article>
              
              
Line 348: Line 363:
        
        
     </article> <!-- #slider -->
     </article> <!-- #slider -->
-
      
+
     <br/>
-
   </body>
+
<br/>
-
</html>
+
<br/>
 +
<br/>
 +
<br/>
 +
<br/>
 +
<br/>
 +
<br/>
 +
<br/>
 +
<br/>
 +
<div class="light-background">
 +
  <div class="width80">
 +
    <div class="divider" />
 +
   </div>
 +
</div>
 +
 +
<div id="animatedmenu">
 +
<div class="container">
 +
<ul id="sti-menu" class="sti-menu">
 +
<li data-hovercolor="#37c5e9">
 +
<a href="https://2014hs.igem.org/Team:AUC_TURKEY/Project/Introduction">
 +
<h2 data-type="mText" class="sti-item">Introduction</h2>
 +
<h3 data-type="sText" class="sti-item">Story of a color wizard</h3>
 +
<span data-type="icon" class="sti-icon sti-icon-care sti-item"></span>
 +
</a>
 +
</li>
 +
<li data-hovercolor="#ff395e">
 +
<a href="https://2014hs.igem.org/Team:AUC_TURKEY/Notebook//Timeline">
 +
<h2 data-type="mText" class="sti-item">Notebook</h2>
 +
<h3 data-type="sText" class="sti-item">The day by day process</h3>
 +
<span data-type="icon" class="sti-icon sti-icon-alternative sti-item"></span>
 +
</a>
 +
</li>
 +
<li data-hovercolor="#57e676">
 +
<a href="https://2014hs.igem.org/Team:AUC_TURKEY/Team/Participants">
 +
<h2 data-type="mText" class="sti-item">Participants</h2>
 +
<h3 data-type="sText" class="sti-item">Hardworking guys</h3>
 +
<span data-type="icon" class="sti-icon sti-icon-info sti-item"></span>
 +
</a>
 +
</li>
 +
<li data-hovercolor="#d869b2">
 +
<a href="https://2014hs.igem.org/Team:AUC_TURKEY/Results/Functional_Essay">
 +
<h2 data-type="mText" class="sti-item">Assay</h2>
 +
<h3 data-type="sText" class="sti-item">Are those proteins working?</h3>
 +
<span data-type="icon" class="sti-icon sti-icon-family sti-item"></span>
 +
</a>
 +
</li>
 +
<li data-hovercolor="#ffdd3f">
 +
<a href="https://2014hs.igem.org/Team:AUC_TURKEY/Human_Practices/Future_Plan">
 +
<h2 data-type="mText" class="sti-item">Future Plans</h2>
 +
<h3 data-type="sText" class="sti-item">What we are looking forward to</h3>
 +
<span data-type="icon" class="sti-icon sti-icon-technology sti-item"></span>
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js"></script>
 +
<script type="text/javascript" src="https://2014hs.igem.org/Team:AUC_TURKEY/jquery.easing.1.3.js?action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript" src="https://2014hs.igem.org/Team:AUC_TURKEY/jquery.iconmenu.js?action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript">
 +
$(function() {
 +
$('#sti-menu').iconmenu({
 +
animMouseenter : {
 +
'mText' : {speed : 200, easing : 'easeOutExpo', delay : 250, dir : 1},
 +
'sText' : {speed : 200, easing : 'easeOutExpo', delay : 0, dir : 1},
 +
'icon'  : {speed : 200, easing : 'easeOutExpo', delay : 500, dir : 1}
 +
},
 +
animMouseleave : {
 +
'mText' : {speed : 200, easing : 'easeInExpo', delay : 250, dir : 1},
 +
'sText' : {speed : 200, easing : 'easeInExpo', delay : 500, dir : 1},
 +
'icon'  : {speed : 200, easing : 'easeInExpo', delay : 0, dir : 1}
 +
}
 +
});
 +
});
 +
</script>
</body>
</body>
 +
 +
</html>
</html>

Latest revision as of 17:30, 26 April 2015

Back to top Take a Tour














Retrieved from "http://2014hs.igem.org/Team:AUC_TURKEY"