Difference between revisions of "Team:Tokyo-NoKoGen/Demo"

 
(27 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{TeamTokyoNokogen}}
 
{{TeamTokyoNokogen}}
 +
 
<html>
 
<html>
 
<style>
 
<style>
 +
html, body{
 +
 +
height:auto;
 +
margin-top:-10px;
 +
padding:20px;
 +
background:#ffffff;
 +
        position:absolute;
 +
}
 
div#wrap {
 
div#wrap {
 
width:80%;
 
width:80%;
 
text-align:center;
 
text-align:center;
 +
position:relative;
 +
min-height:100%;
 
margin-left:auto;
 
margin-left:auto;
 
margin-right:auto;
 
margin-right:auto;
 +
 +
 
}
 
}
 
div#bannerContainer {
 
div#bannerContainer {
−
width:80%;
+
width:75%;
 
position:absolute;
 
position:absolute;
−
border:solid 1px;
+
 
 
         top:0px;
 
         top:0px;
  
Line 18: Line 31:
 
width:900px;
 
width:900px;
 
height:330px;
 
height:330px;
−
margin-top:10px;
+
margin-top:-10px;
−
border:solid 1px;
+
 
 
         position:absolute;
 
         position:absolute;
 
         top:260px
 
         top:260px
−
 
 
}
 
}
  
−
div#overview {
+
.overview {
 
width:600px;
 
width:600px;
 
height:300px;
 
height:300px;
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:10px;
 
margin-left:10px;
−
background:#ffffff;
+
background:#FFFFCC;
−
      border:solid 1px #000000;
+
     
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
float:left;
 
float:left;
 +
cursor:pointer;
 
}
 
}
−
div#team {
+
 
−
width:250px;
+
.team {
−
height:300px;
+
width:260px;
−
margin-top:-5px;
+
height:135px;
 +
      position:relative;
 +
left:15px;
 +
margin-top:10px;
 +
margin-left:20px;
 +
background:#CCFF99;
 +
display: inline-block; _display: inline;
 +
display: table-cell;    /* ④ */ 
 +
　  vertical-align: middle;
 +
left:15px;
 +
cursor:pointer;
 +
}
 +
 
 +
        .notebook  {
 +
width:260px;
 +
height:140px;
 +
position:relative;
 +
margin-top:5px;
 +
margin-left:15px;
 
margin-right:10px;
 
margin-right:10px;
−
background: #ffffff;
+
background:#91d176;
−
       border:solid 1px #000000;
+
       display: table-cell;  
−
float:right;
+
              display: inline-block; _display: inline;
−
}
+
      　    vertical-align: middle;
 +
      top:300px
 +
 
 +
display: inline-block; _display: inline;
 +
cursor:pointer;
 +
    　 　}
 +
 
 
div#box2 /*2段目の箱*/ {
 
div#box2 /*2段目の箱*/ {
 
width:900px;
 
width:900px;
 
height:330px;
 
height:330px;
−
margin-top:10px;
+
margin-top:-10px;
−
border:solid 1px;
+
 
 
         position:absolute;
 
         position:absolute;
−
       top:340px;
+
       top:330px;
 
       left:0px;
 
       left:0px;
 
}
 
}
  
−
div#facebook {
+
.facebook {
 
width:200px;
 
width:200px;
 
height:135px;
 
height:135px;
Line 61: Line 98:
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:20px;
 
margin-left:20px;
−
background:#ffffff;
+
background:#6b8bcd;
−
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
display: table-cell;    /* ④ */   
 
display: table-cell;    /* ④ */   
Line 68: Line 104:
 
　  position:absolute;
 
　  position:absolute;
 
left:15px;
 
left:15px;
 +
cursor:pointer;
 
}
 
}
−
div#twitter {
+
.twitter {
 
width:200px;
 
width:200px;
 
height:140px;
 
height:140px;
Line 76: Line 113:
 
margin-top:300px;
 
margin-top:300px;
 
margin-left:20px;
 
margin-left:20px;
−
background:#ffffff;
+
background:#6b8bcd;
−
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
display: table-cell;     
 
display: table-cell;     
 
     　 vertical-align: middle;　　
 
     　 vertical-align: middle;　　
 +
cursor:pointer;
 
     　 　}
 
     　 　}
  
−
div#project {
+
.project {
 
width:650px;
 
width:650px;
 
height:300px;
 
height:300px;
 
margin-top:-300px;
 
margin-top:-300px;
 
margin-right:10px;
 
margin-right:10px;
−
background: #ffffff;
+
background: #79d480;
−
      border:solid 1px #000000;
+
 
float:right;
 
float:right;
 +
cursor:pointer;
 
}
 
}
 
div#box3 /*3段目の箱*/ {
 
div#box3 /*3段目の箱*/ {
 
width:900px;
 
width:900px;
−
height:330px;
+
height:180px;
−
margin-top:10px;
+
margin-top:-25px;
−
border:solid 1px;
+
 
 
         position:absolute;
 
         position:absolute;
−
         top:350px
+
         top:330px
 
}
 
}
−
div#Ache {
+
 
 +
.Ache {
 
width:210px;
 
width:210px;
−
height:300px;
+
height:150px;
 
margin-top:10px;
 
margin-top:10px;
−
margin-left:10px;
+
margin-left:12px;
−
background:#ffffff;
+
background:#71b4d0;
−
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
float:left;
 
float:left;
 +
cursor:pointer;
 
}
 
}
−
div#Human {
+
.Human {
 
width:210px;
 
width:210px;
−
height:300px;
+
height:150px;
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:10px;
 
margin-left:10px;
−
background:#ffffff;
+
background:#6ecec7;
−
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
float:left;
 
float:left;
 +
cursor:pointer;
 
}
 
}
−
div#parts {
+
.parts {
 
width:210px;
 
width:210px;
−
height:300px;
+
height:150px;
 
margin-top:10px;
 
margin-top:10px;
 
margin-left:10px;
 
margin-left:10px;
−
background:#ffffff;
+
background:#7bd593;
−
      border:solid 1px #000000;
+
 
display: inline-block; _display: inline;
 
display: inline-block; _display: inline;
 
float:left;
 
float:left;
 +
cursor:pointer;
  
 
}
 
}
−
      div#safety {
+
      .safety {
 
width:210px;
 
width:210px;
−
height:300px;
+
height:150px;
 
margin-top:-5px;
 
margin-top:-5px;
 
margin-left:10px;
 
margin-left:10px;
−
background:#ffffff;
+
background:#7593d3;
−
      border:solid 1px #000000;
+
 
        display: inline-block; _display: inline;
 
        display: inline-block; _display: inline;
 
float:left;
 
float:left;
 +
cursor:pointer;
 
}
 
}
  
Line 150: Line 188:
 
h2 {
 
h2 {
 
     font-size:20px;
 
     font-size:20px;
−
     font-family:Georgia;
+
     font-family:fantasy;
 
     text-decoration:none;
 
     text-decoration:none;
 
   }
 
   }
Line 225: Line 263:
 
　　<div id="box1"/*見えない1段目のボックス*/>　
 
　　<div id="box1"/*見えない1段目のボックス*/>　
  
−
　　<div id="overview">
+
　　<div class="overview">
−
   　　　　　　　 <img src="http://junk-blog.com/wp-content/uploads/2014/09/sample_image.jpg" alt="サンプル画像" width="550" height="250">
+
　　  <h2>Introduction</h2>
−
   　　　　　　　　　　
+
   　　　　　<!--　　 <img src="http://junk-blog.com/wp-content/uploads/2014/09/sample_image.jpg" alt="サンプル画像" width="550" height="250"alt="Overview"/>  -->
 +
   　　　　　　　
 +
  　　　　　　　  <a href="https://2015.igem.org/Team:Tokyo-NoKoGen" target="_blank"></a></td>
 +
                         
 +
  　　　　　　　
 
　　　　</div>
 
　　　　</div>
 
　　　　
 
　　　　
−
　　<div id="team">
+
　　<div class="team">
−
　<p>team</p>
+
　 <h2>Team</h2>
−
       　　 </div>
+
　<a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Team" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7 ></a>
 +
       　　 </div>
 +
      　　
 +
              <div class="notebook">
 +
　<h2>Notebook</h2>
 +
　<a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Notebook" target="_blank" onMouseOver="this.bgColor='#d3d3d3'" onMouseOut="this.bgColor='#e7e7e7'" bgColor=#e7e7e7 ></a>
 +
      　　  </div>
 +
 
 +
 
 
          
 
          
 
<div id="box2"/*見えない2段目のボックス*/>　
 
<div id="box2"/*見えない2段目のボックス*/>　
−
<div id="facebook">
+
<div class="facebook">
−
   　　　　　　　 <p>facebook</p>
+
   　　　　　　　 <h2>facebook</h2>
 +
  　　　　　　　<a href="https://www.facebook.com/tokyo.nokogen" target="_blank"></a>
 +
  　　　　　　　
 
   　　</div>
 
   　　</div>
−
   　　<div id="twitter">
+
   　　<div class="twitter">
−
   　　　　　　　 <p>twitter</p>
+
   　　　　　　　 <h2>twitter</h>
 +
  　　　　　　　 <a href="https://twitter.com/iGEM_Nokogen" target="_blank"></a>
 +
  　　　　　　　
 
   　　</div>
 
   　　</div>
 
   　　
 
   　　
−
  　　 　<div id="project">
+
  　　 　<div class="project">
−
   　　　　　　<p>project</p>　  
+
   　　　　　　<h2>project</h2>　
 +
  　　　　　　<a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Description" target="_blank"></a> 　　　　　　
 
   　　　</div>
 
   　　　</div>
 
      
 
      
 
       <div id="box3"/*見えない3段目のボックス*/>　　
 
       <div id="box3"/*見えない3段目のボックス*/>　　
−
   　　<div id="Ache">
+
   　　<div class="Ache">
−
   　　　　　　　 <p>Achievement</p>
+
   　　　　　　　 <h2>Achievement</h2>
 +
  　　　　　　　 <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/achievement" target="_blank"></a>  
 
   　　</div>
 
   　　</div>
−
   　　<div id="Human">
+
   　　<div class="Human">
−
   　　　　　　　 <p>Human practice</p>
+
   　　　　　　　 <h2>Human practice</h2>
 +
  　　　　　　　  <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Practices" target="_blank"></a>
 
   　　</div>
 
   　　</div>
−
   　　<div id="parts">
+
   　　<div class="parts">
−
   　　　　　　　 <p>Parts</p>
+
   　　　　　　　 <h2>Parts</h2>
 +
  　　　　　　　  <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Parts" target="_blank"></a>
 
   　　</div>
 
   　　</div>
−
   　　 <div id="safety">
+
   　　 <div class="safety">
−
   　　　　　　　 <p>Safety</p>
+
   　　　　　　　 <h2>Safety</h2>
 +
  　　　　　　　  <a href="https://2015.igem.org/Team:Tokyo-NoKoGen/Safety" target="_blank"></a>
 
   　　</div>
 
   　　</div>
 
   　　
 
   　　
Line 267: Line 326:
 
  </div>　　　　　　　　
 
  </div>　　　　　　　　
 
  </div>
 
  </div>
 +
<script type="text/javascript">
 +
$(function(){
 +
    $(".overview").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
 +
$(function(){
 +
    $(".team").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
$(function(){
 +
    $(".facebook").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
$(function(){
 +
    $(".twitter").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
$(function(){
 +
    $(".notebook").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
$(function(){
 +
    $(".project").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
$(function(){
 +
    $(".Ache").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
$(function(){
 +
    $(".Human").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
$(function(){
 +
    $(".parts").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
$(function(){
 +
    $(".safety").click(function(){
 +
        window.location=$(this).find("a").attr("href");
 +
        return false;
 +
    });
 +
});
 +
</script>
 +
 +
 +
/*footer*/
 +
<style>
 +
div#wrapper2 {
 +
width:80%;
 +
text-align:center;
 +
position:relative;
 +
min-height:100%;
 +
margin-left:auto;
 +
margin-right:auto;
 +
}
 +
 +
 +
div#footer {
 +
    margin:0 auto;
 +
    position:absolute;
 +
    width:900px;
 +
 +
　　left : -200px ;
 +
    bottom:-1300px;
 +
        }
 +
 +
 +
div#footer img {
 +
    width:200px;
 +
        }
 +
p {
 +
    font-size:16px;
 +
    font-family:Georgia;
 +
    line-height:2;
 +
  }
 +
h2 {
 +
    font-size:20px;
 +
    font-family:fantasy;
 +
    text-decoration:none;
 +
  }
 +
</style>
 +
 +
 +
<body>
  
 +
<div id="wrapper">
 +
<div id="footer">
 +
<a href="http://www.idtdna.com/site"><img src="https://static.igem.org/mediawiki/2014/5/5e/Noko14_IDT.png"></a>
 +
<a href="http://www.ultizyme.jp/"><img src="https://static.igem.org/mediawiki/2014/c/ce/Noko14_Image91.jpg"></a>
 +
<a href="http://www.cosmobio.co.jp/index_e.asp"><img src="https://static.igem.org/mediawiki/2014/e/e5/Noko14_Logo_e.jpg"></a>
 +
<a href="http://www.mbl.co.jp/e/index.html"><img src="https://static.igem.org/mediawiki/2014/4/4f/Noko14_MBL.gif"></a>
 +
<a href="http://www.idtdna.com/site"><img src="https://static.igem.org/mediawiki/2014/a/ad/Noko14_li.png"></a>
 +
<a href="http://www.tuat.ac.jp/en/index.html"><img src="https://static.igem.org/mediawiki/2014/3/39/Noko14_tuat.png"></a>
 +
<a href="http://www.tuat.ac.jp/~tanpaku/"><img src="https://static.igem.org/mediawiki/2014/3/3c/Noko14_ike.jpg"></a>
 +
<a href="http://www.tuat.ac.jp/~kakusan/index.html"><img src="https://static.igem.org/mediawiki/2014/7/77/Noko14_ikeken.jpg"></a>
 +
</div>
 +
</div>
 +
</body>
  
 +
/*footer*/
 
</html>
 
</html>

Latest revision as of 16:31, 8 September 2015

　　
　 　　
　　

Introduction

　　　　　 　　　　　　　 　　　　　　　 　　　　　　　 　　　　
　　　　 　　
　

Team

　 　　
　　
　

Notebook

　 　　
　 　　 　　 　　 　
　　　　　　

project

　 　　　　　　 　　　　　　 　　　
　　 　　
　　　　　　　

Achievement

　　　　　　　 　　
　　
　　　　　　　

Human practice

　　　　　　　 　　
　　
　　　　　　　

Parts

　　　　　　　 　　
　　
　　　　　　　

Safety

　　　　　　　 　　
　　
　　　 　　　
　　　　　　　　
/*footer*/
/*footer*/