Team:USTC-China/test

From 2011.igem.org

(Difference between revisions)
 
(12 intermediate revisions not shown)
Line 1: Line 1:
 +
 +
{{Team:USTC-China/temp}}
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns="http://www.w3.org/1999/xhtml">
Line 22: Line 24:
a:active, a:hover { color: #0683ab; text-decoration: underline; }
a:active, a:hover { color: #0683ab; text-decoration: underline; }
-
img { margin: auto; padding: 0px; border: none; display:block;}
+
img {
 +
margin: 0;
 +
padding: 0;
 +
border: none;
 +
display:block;
 +
}
p{
p{
Line 70: Line 77:
position: relative;
position: relative;
width:900px;
width:900px;
-
height:85px;
+
height:50px;
padding: 0;
padding: 0;
margin: 0 auto;
margin: 0 auto;
Line 116: Line 123:
position:relative;
position:relative;
line-height:1.5em;
line-height:1.5em;
-
width: 738px;
+
width: 900px;
height: 50px;
height: 50px;
 +
;
 +
background-color: #004370;
}
}
#nav .on {
#nav .on {
color:#fff !important;
color:#fff !important;
-
background-image: url(https://static.igem.org/mediawiki/2011/0/00/USTC_Software_nav_button_bg.jpg) !important;
+
background-image: url(https://static.igem.org/mediawiki/2011/2/23/USTC_China_nav_button_bg.jpg) !important;
background-position: bottom left !important;
background-position: bottom left !important;
}
}
Line 132: Line 141:
     text-decoration:none;
     text-decoration:none;
text-transform: uppercase;
text-transform: uppercase;
-
background-image: url(https://static.igem.org/mediawiki/2011/0/00/USTC_Software_nav_button_bg.jpg);
+
background-image: url(https://static.igem.org/mediawiki/2011/2/23/USTC_China_nav_button_bg.jpg);
background-position: top left;
background-position: top left;
}
}
Line 138: Line 147:
#nav a:hover {
#nav a:hover {
     color:#fff;
     color:#fff;
-
background-image: url(https://static.igem.org/mediawiki/2011/0/00/USTC_Software_nav_button_bg.jpg);
+
background-image: url(https://static.igem.org/mediawiki/2011/2/23/USTC_China_nav_button_bg.jpg);
background-position: bottom left;
background-position: bottom left;
 +
background-color: #004370;
}
}
#nav li{
#nav li{
-
    float:left;
+
float:left;
-
    position:relative;
+
position:relative;
-
+
background: #004370;
}
}
Line 154: Line 164:
     display:none;
     display:none;
z-index: 1;
z-index: 1;
 +
background-color: #004370;
}
}
Line 159: Line 170:
     width:9em;
     width:9em;
     float:left;
     float:left;
-
background-color: #2e2e2e;
+
background-color: #004370;
 +
/* #2e2e2e*/
 +
/* #004370;*/
 +
/* #292929;*/
 +
/*#33ADFF;*/
background-image: none !important;
background-image: none !important;
}
}
#nav li ul a:hover {
#nav li ul a:hover {
-
background-color: #292929;
+
background-color: #33ADFF;
}
}
#nav ul ul{
#nav ul ul{
top:auto;
top:auto;
 +
background-color: #004370;
}
}
Line 226: Line 242:
clear:both;
clear:both;
}
}
 +
 +
/*box*/
.box_content{
.box_content{
width:267px;
width:267px;
height:300px;
height:300px;
float:left;
float:left;
-
margin:10px 10px 30px 10px;
+
margin:10px 5px 10px 10px;
background:url(https://static.igem.org/mediawiki/2011/a/a4/USTC-China_box_bg.gif) no-repeat top center;
background:url(https://static.igem.org/mediawiki/2011/a/a4/USTC-China_box_bg.gif) no-repeat top center;
}
}
Line 250: Line 268:
}
}
.box_text{
.box_text{
-
width:190px;
+
width:220px;
 +
float:left;
 +
text-align:justify;
 +
padding:0 0 0 10px;
 +
}
 +
a.details{
 +
float:right;
 +
padding:5px 15px 0 0;
 +
text-decoration:none;
 +
font-weight:bold;
 +
color:#f8851f;
 +
}
 +
 
 +
 
 +
 
 +
/*box*/
 +
 
 +
 
 +
 
 +
/*sbox*/
 +
.sbox_content{
 +
width:250px;
 +
height:600px;
 +
float:left;
 +
margin:10px,70px,20px,30px;
 +
background:url(images/USTC-China_box_bg.gif) no-repeat top center;
 +
}
 +
.sbox_title{
 +
padding:10px 0 10px 0;
 +
}
 +
.stitle_icon{
float:left;
float:left;
-
text-align:justify;
+
padding:0 5px 0 10px;
-
padding:0 0 0 10px;
+
}
 +
.sbox_text_content{
 +
width:230px;
 +
float:left;
 +
padding:15px 0 0 15px;
 +
}
 +
.sbox_icon{
 +
float:left;
 +
padding:0 5px 0 0 ;
 +
}
 +
.sbox_text{
 +
width:220px;
 +
float:left;
 +
text-align:justify;
 +
padding:0 0 0 10px;
}
}
a.details{
a.details{
Line 262: Line 324:
color:#f8851f;
color:#f8851f;
}
}
 +
 +
 +
 +
/*box*/
 +
 +
/* footer */
/* footer */
#mfooter{
#mfooter{
-
width:900px;
+
width:900px;
-
height:45px;
+
height:60px;
-
color:#508aa1;
+
color:#508aa1;
-
text-align: center;
+
text-align: center;
-
background-color:#e8eff2;
+
background-color:#e8eff2;
}
}
Line 324: Line 392:
/* end of footer*/
/* end of footer*/
</style>
</style>
 +
 +
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
 +
<script type="text/javascript">
 +
$(document).ready(function() {
 +
//Set Default State of each portfolio piece
 +
$(".paging").show();
 +
$(".paging a:first").addClass("active");
 +
 +
//Get size of images, how many there are, then determin the size of the image reel.
 +
var imageWidth = $(".window").width();
 +
var imageSum = $(".image_reel img").size();
 +
var imageReelWidth = imageWidth * imageSum;
 +
 +
//Adjust the image reel to its new size
 +
$(".image_reel").css({'width' : imageReelWidth});
 +
 +
//Paging + Slider Function
 +
rotate = function(){
 +
var triggerID = $active.attr("rel") - 1; //Get number of times to slide
 +
var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
 +
 +
$(".paging a").removeClass('active'); //Remove all active class
 +
$active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
 +
 +
//Slider Animation
 +
$(".image_reel").animate({
 +
left: -image_reelPosition
 +
}, 500 );
 +
 +
};
 +
 +
//Rotation + Timing Event
 +
rotateSwitch = function(){
 +
play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds
 +
$active = $('.paging a.active').next();
 +
if ( $active.length === 0) { //If paging reaches the end...
 +
$active = $('.paging a:first'); //go back to first
 +
}
 +
rotate(); //Trigger the paging and slider function
 +
}, 4000); //Timer speed in milliseconds
 +
};
 +
 +
rotateSwitch(); //Run function on launch
 +
 +
//On Hover
 +
$(".image_reel a").hover(function() {
 +
clearInterval(play); //Stop the rotation
 +
}, function() {
 +
rotateSwitch(); //Resume rotation
 +
});
 +
 +
//On Click
 +
$(".paging a").click(function() {
 +
$active = $(this); //Activate the clicked paging
 +
//Reset Timer
 +
clearInterval(play); //Stop the rotation
 +
rotate(); //Trigger rotation immediately
 +
rotateSwitch(); // Resume rotation
 +
return false; //Prevent browser jump to link anchor
 +
});
 +
 +
});
 +
</script>
 +
 +
<style type="text/css">
 +
 +
/*--Window & Text Table--*/
 +
table#rotator_news {
 +
pading-bottom: 10px;
 +
}
 +
 +
/*--Main Image Rotator Container--*/
 +
.main_view {
 +
float: left;
 +
position: relative;
 +
/*border: 0px solid #fff;*/
 +
width: 650px;
 +
}
 +
/*--Image Rotator Window/Masking Styles--*/
 +
.window {
 +
height:400px;
 +
width: 650px;
 +
overflow: hidden; /*--Hides anything outside of the set width/height--*/
 +
position: relative;
 +
}
 +
.image_reel {
 +
position: absolute;
 +
top: 0;
 +
left: -3px;
 +
}
 +
.image_reel img {float: left;}
 +
 +
/*--Paging Styles--*/
 +
.paging {
 +
position: absolute;
 +
bottom: 0px; right: -15px;
 +
width: 400px; height:47px; /*--Increase this width when adding more numbers in paging--*/
 +
z-index: 100; /*--Assures the paging stays on the top layer--*/
 +
text-align: center;
 +
line-height: 40px;
 +
background: url(paging_bg2.png) no-repeat;
 +
display: none; /*--Hidden by default, will be later shown with jQuery--*/
 +
}
 +
.paging a {
 +
padding: 5px;
 +
text-decoration: none;
 +
color: #fff;
 +
}
 +
.paging a.active {
 +
font-weight: bold;
 +
/*background: #cdcdcd;*/
 +
border: 1px solid #cdcdcd;
 +
-moz-border-radius: 3px;
 +
-khtml-border-radius: 3px;
 +
-webkit-border-radius: 3px;
 +
}
 +
.paging a:hover {font-weight: bold;}
 +
</style>
 +
</head>
</head>
Line 333: Line 521:
<div class="header">
<div class="header">
        
        
-
        <ul id="nav">
+
      <div align="center">  <ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
     <li><a href="#">Project</a>
     <li><a href="#">Project</a>
-
<ul>
+
        <ul>
<li><a href="#">module</a></li>
<li><a href="#">module</a></li>
    <li><a href="#"> results</a>
    <li><a href="#"> results</a>
-
                <li><a href="#">modeling</a></li>
 
                 <li><a href="#">application</a></li>
                 <li><a href="#">application</a></li>
 +
</ul>
 +
</li>
 +
       
 +
      <li><a href="#">Drylab</a>
 +
        <ul>
 +
                <li><a href="#">modeling</a></li>
 +
                <li><a href="#">Riboswitch</a></li>
</ul>
</ul>
</li>
</li>
Line 373: Line 567:
    <li><a href="https://2011.igem.org/Team:USTC-Software/meetup">group</a></li>
    <li><a href="https://2011.igem.org/Team:USTC-Software/meetup">group</a></li>
  </ul>
  </ul>
-
       </ul>
+
       </ul> 
 +
      </div>
    
    
-
       <div id="logo"><img src="https://static.igem.org/mediawiki/2011/d/d9/USTC-China_logo.png" width="100" height="84"/></div>
+
       <div id="logo"></div>
        
        
        
        
Line 384: Line 579:
      
      
     <div id="middle_box">
     <div id="middle_box">
-
     <div align="center" ><img src="https://static.igem.org/mediawiki/2011/f/fc/USTC-China_middle_banner.gif" width="900"/> </div>
+
     <div align="center" ><img src="https://static.igem.org/mediawiki/2011/thumb/3/31/%E6%A0%87%E9%A2%98%E6%A0%8F%E6%9C%80%E7%BB%88%E6%8E%A8%E8%8D%90%E6%9C%89%E5%AD%97%E7%89%88.png/965px-%E6%A0%87%E9%A2%98%E6%A0%8F%E6%9C%80%E7%BB%88%E6%8E%A8%E8%8D%90%E6%9C%89%E5%AD%97%E7%89%88.png" width="900"/> </div>
   </div>
   </div>
 +
 
 +
 
 +
 
 +
  <br/>
 +
 
 +
  <table width="900" height="398" border="0">
 +
    <tr>
 +
      <td width="661">  <table id="rotator_news">
 +
<tr>
 +
<td id="window_images">
 +
<div class="main_view">
 +
    <div class="window">
 +
        <div class="image_reel">
 +
                    <img src="https://static.igem.org/mediawiki/2011/e/e5/NO1.png" style=" margin-right:0px; width:650px; height:400px" alt="" />
 +
                    <img src="https://static.igem.org/mediawiki/2011/3/3a/NO2.png" style=" margin-right:0px; width:650px; height:400px" alt="" />
 +
                    <img src="https://static.igem.org/mediawiki/2011/5/50/NO3.jpg" style=" margin-right:0px; width:650px; height:400px" alt="" />
 +
                    <img src="https://static.igem.org/mediawiki/2011/3/3e/NO4.png" style=" margin-right:0px; width:650px; height:400px" alt="" />
 +
                    <img src="https://static.igem.org/mediawiki/2011/c/cd/NO5.png" style=" margin-right:0px; width:650px; height:400px" alt="" />
 +
                    <img src="https://static.igem.org/mediawiki/2011/c/c3/NO6.png" style=" margin-right:0px; width:650px; height:400px" alt="" />
 +
                    <img src="https://static.igem.org/mediawiki/2011/c/c3/NO7.png" style=" margin-right:0px; width:650px; height:400px" alt="" />             
 +
        </div>
 +
    </div>
 +
    <div class="paging">
 +
        <a href="#" rel="1">1</a>
 +
        <a href="#" rel="2">2</a>
 +
        <a href="#" rel="3">3</a>
 +
        <a href="#" rel="4">4</a>
 +
        <a href="#" rel="5">5</a>
 +
        <a href="#" rel="6">6</a>
 +
        <a href="#" rel="7">7</a>
 +
 +
    </div>
 +
</div> <!-- close "main_view" div -->
 +
</td>
 +
</tr>
 +
</table></td>
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
     
 +
      <td width="229">
 +
          <br/>
 +
        <p style="font-family:Verdana, Geneva, sans-serif; font-size:24px; text-align:center;">
 +
        At a Glance</p>
 +
          <br/>
 +
<img src="https://static.igem.org/mediawiki/2011/thumb/4/43/MODULE.png/300px-MODULE.png" width="235" />
 +
          <br/>       
 +
          <img src="https://static.igem.org/mediawiki/2011/thumb/b/b1/RESULTS.png/300px-RESULTS.png" width="235" />
 +
          <br/>
 +
          <img src="https://static.igem.org/mediawiki/2011/thumb/b/b2/GALLARY.png/300px-GALLARY.png" width="235" />
 +
          <br/>
 +
          <img src="https://static.igem.org/mediawiki/2011/thumb/3/3b/MODELING.png/302px-MODELING.png" width="235" />
 +
          <br/>
 +
         
 +
         
 +
         
 +
        </td>
 +
    </tr>
 +
  </table>
 +
  <br/>
 +
 
 +
    <br/>
 +
    <br/> <br/>
 +
 
 +
 
 +
 
 +
 
 +
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
     <div id="main_content">
     <div id="main_content">
      
      
Line 508: Line 794:
   <ul class="mfooter_menu">
   <ul class="mfooter_menu">
-
                 <li><a href="#" target="_parent">Home</a></li>
+
                 <li><a href="./index.html" target="_parent">Home</a></li>
-
                 <li><a href="#" target="_parent">Project</a></li>
+
                 <li><a href="#" class="current">Project</a></li>
-
                 <li><a href="#" target="_parent">Parts</a></li>
+
                 <li><a href="./03_model.html" target="_parent">Parts</a></li>
-
                 <li><a href="#" target="_parent"> Team</a></li>
+
                 <li><a href="./03_model.html" target="_parent"> Team</a></li>
-
                 <li><a href="#" target="_parent">WetLab</a></li>
+
                 <li><a href="./04_notebook.html" target="_parent">WetLab</a></li>
-
                 <li class="last_menu"><a href="#" target="_parent">Human Practice</a></li>
+
                 <li class="last_menu"><a href="./06_team.html" target="_parent">Human Practice</a></li>
                  
                  
   </ul>
   </ul>

Latest revision as of 11:59, 5 October 2011

Team:USTC-China - 2011.igem.org


1 2 3 4 5 6 7

At a Glance




Project

We organized an interesting project Self-Organized Bacteria Project. E.colis become smarter after our changes...
+ details

Bio-Parts

Here we presents the bio-parts we submitted and modulated.
+ details

Modeling

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ details

WetLab

Here presents our journeys of iGEM. We keep our timetable, experiment progress.
+ details

Human Practice

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ details

Team

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ details



































Retrieved from "http://2011.igem.org/Team:USTC-China/test"