Team:BIT/Team 3

From 2014.igem.org

Revision as of 09:19, 28 July 2014 by CharMoon (Talk | contribs)

<SCRIPT src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type=text/javascript></SCRIPT> <script src="js/dropdown.js" type="text/javascript"></script> <script src="js/jquery.js" type="text/javascript"></script> <script src="js/index.js" type="text/javascript"></script>

<script>


function changeImg(){ document.getElementsByClassName("gif1").src="img/BIT_20140725104903.gif";


} $(document).ready(function(){ $(".nav li").mouseover(function(){ $(this).css("background","rgba(255,255,255,0.8)") }); $(".nav li").mouseout(function(){ $(this).css("background","none") }); });

$(document).ready(function(){ $('ul.one').hide();

//Open Menu $('.nav li').hover( function(){ var openMenu= $(this).children('ul.one'); $(openMenu).show(); }, function(){ var openMenu= $(this).children('ul.one'); $(openMenu).hide(); });

}); </script>

<style type="text/css"> 

 #logo{ width:1024px; margin:auto; height:45px;}
  1. logo img{ position:absolute;left:485px;}
  2. address{width:1024px; height:50px; }
  1. others{

margin:auto 0; width:1024px; height:130px; margin-top:10px; }

  1. address p{ text-align:center; line-height:5px;}

body{ font-family:"helvetica"; margin:0;}

  1. main_container{ background:#000000; width:100%;height:100%; }
  2. container{width:1024px;margin:auto; position:relative;background:rgba(255,255,255,0.5); 
         }


  1. header{width:1024px; 
       height:255px;

text-align:center; background:url(http:/2014.igem.org/wiki/images/9/92/BIT_radiation1.jpg); margin:auto; position:relative;


}

  1. content{height:420px; 
        width:1024px;

margin:auto; background-color:#FFF;

position:relative; }

  1. footer ul{ margin:25px 20px 0 0;}
  2. footer li.style{ width:40px;}
  3. footer li{

list-style:none; float:right; box-shadow:none; border-radius:0; margin:0; padding:0; width:90px; }

  1. footer{

width:1024px; position:relative; margin:auto; margin-top:0; background-color:#FFF; color:#000; height:140px; font-size:12px;

}

  1. table1{ width:500px; position:absolute; table-layout:fixed;

left:130px; height:100px}


td{width: 170px; padding:10px 10px 0 10px; word-wrap:break-word; }


  1. table1 img{ width:20px; height:20px;vertical-align:text-bottom; margin-right:10px; }

@font-face{ font-family:"Maiandra" ;src:url(../fonts/Arabica.swf);format("opentype");}


  1. menubar { 
   position: absolute;

height:20px; 

   white-space: nowrap;
   top: 0px;
   width: 500px;
   z-index: 5;
   font-family: sans-serif;
   font-size: 20sp;

}

.left-menu, .left-menu a { 

   left: 0px;
   text-align: left;
   color:transparent;
   text-transform: lowercase;

}

.left-menu:hover { 

   color: white;
   background-color: #555555

} .right-menu, .right-menu a { 

   right: 0px;
   text-align: right;
   color: white;

}

  1. menubar ul { 
   list-style: none;

margin:0px;

}

  1. menubar li { 
   display: inline;
   position: relative;
   cursor: pointer;
   padding-left: 0px;
   padding-right: 0px;

} .left-menu li a { 

   padding: 0px 10px 0px 0px;

text-decoration:none; color: inherit; } .left-menu li a:hover { 

   color: #aaaaff;
   text-decoration: none;

} .left-menu li a:visited{ 

   color: #69F; 
   text-decoration: none;

}


.right-menu li a { 

   padding: 1.5px 15px 1.5px 10px;
  
   background-color: #606060;

text-decoration:none; margin:0px; } .right-menu li a:link { 

   color: white;
   text-decoration: none;

} .right-menu li a:hover { 

   color: #aaaaff;
   text-decoration: none;

} .right-menu li a:visited{ 

   color: #69F; 
   text-decoration: none;

}

.nav a, .nav h3, .nav h5, .one li a{ text-transform: uppercase; } .nav a{ display:block; text-decoration: none; } .nav i { display: block; padding: 0 5px; float: none; } .nav li { list-style: none; } .nav p {


font-size: 13px; line-height: 23px;

} .nav input, .nav textarea{ display:block; border:none; } .nav h3 { margin:0 0 13px 0; padding:3px 0 5px 0; border-bottom:1px solid rgba(51,51,51,.2);

font-size: 20px; } .nav h5 { font-size: 16px; } .nav h6{ line-height: 20px;

font-family: Cambria, Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif; font-size:13px; font-style:italic; } .nav img { padding: 5px;

box-shadow: 1px 1px 4px rgba(102,102,102,.4); -webkit-box-shadow: 1px 1px 4px rgba(102,102,102,.4); -moz-box-shadow: 1px 1px 4px rgba(102,102,102,.4);

transition: all .3s; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; -ms-transition: all .3s; } .nav img:hover { transform:scale(1.1); -webkit-transform:scale(1.1); -moz-transform:scale(1.1); -ms-transform:scale(1.1); -o-transform:scale(1.1); }


.label{ color:#FFF;} .nav { display: block; position:absolute; top:230px; left:100px;

height:50px; margin: 0 0 20px 0 ; padding:0 5px;

border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;



} .nav li { position: relative; z-index:2; } .nav > li { display: block; float:left; color:#000;

border-right:1px solid #FFF; } .nav > li:hover { cursor: pointer; } .nav li > a{


font-size: 15px; text-align:center; margin:0 15px 0;

transition: background-color .7s; -webkit-transition: background-color .7s; -moz-transition: background-color .5s; -o-transition: background-color .5s; -ms-transition: background-color .5s; } .nav li:last-child{ border:none; }


.nav .one { display: block; position: absolute; top: 100%; left: 0%;

box-shadow: 1px 1px 1px rgba(102,102,102,.2); -webkit-box-shadow: 1px 1px 1px rgba(102,102,102,.2); -moz-box-shadow: 1px 1px 1px rgba(102,102,102,.2);

transition: background-color .3s ease-out; -webkit-transition: background-color .3s ease-out; -moz-transition: background-color .3s ease-out; -o-transition: background-color .3s ease-out; -ms-transition: background-color .3s ease-out; } .one > li { float: none; width: 160px;

} .one > li a{

margin:5px; height:20px;

font-size: 11px; letter-spacing: 1px; } .one li i.icon-chevron-right { float:right; margin:3px 5px 0 0;

font-size: 10px; }

.nav li:hover .one > li{ -webkit-animation: fadeIn .6s 1; animation: fadeIn .6s 1; }

  1. gallery{

left: 0px;

background:rgba(255,255,255,0.5); }

  1. gallery li{

width:200px;

}

  1. gallery li .image{

width:120px; height:30px; padding:5px; margin:auto; border-bottom: 1px solid rgba(51,51,51,.2);


}

  1. gallery li img{

float:left; margin:5px 5px 10px 0px; width:100px; height:150px; }

  1. gallery .image a{

text-align:center; line-height:40px;

}

  1. gallery .image a:hover{

color:#69F;

}

  1. gallery .image a:visited{

color:#CCCCCC;

}

  1. gallery a.more{

display:block; width:35px; height:16px; padding:0px 4px; margin:8px 0 5px 10px; cursor: pointer;

text-transform:capitalize; font-size:10px;

border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px;

-webkit-box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset; -moz-box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset; box-shadow: 1px 1px 2px #fff, 1px 1px 2px rgba(158,111,86,0.3) inset; }

  • {padding:0;list-style-type:none;}

a,img{border:0;}

/* case */ /*.case{background:url(../img/case.jpg) no-repeat;height:627px;overflow:hidden;width:891px;margin:0 auto;}*/ .case_box{position:relative;margin:15px auto 0px;width:860px;height:270px;overflow:hidden} .case_box p{z-index:2;position:absolute;text-indent:-9999px;width:28px;height:51px;top:40%;cursor:pointer} .case_box .prev{text-indent:-9999px;background:url(BIT_previous.png) no-repeat;left:0px} .case_box .next{background:url(BIT_next.png) no-repeat;top:40%;right:0px} .case_box ul{position:absolute;height:250px;overflow:hidden;top:0px;left:0px} .case_box ul li{width:860px;float:left;height:250px; } .case_box ul li dl.case_info{line-height:17px;margin:95px 0px 0px 475px;width:295px;zoom:1;color:#616741;font-size:13px;overflow:hidden} .case_box ul li dl.case_info dd{text-indent:26px}

.case_box ul li.case_1{background:url(http:/2014.igem.org/wiki/images/9/92/BIT_radiation1.jpg) no-repeat center top} .case_box ul li.case_2{background:url(http:/2014.igem.org/wiki/images/3/3e/BIT_2.jpg) no-repeat center top} .case_box ul li.case_3{background:url(http:/2014.igem.org/wiki/images/9/92/BIT_radiation1.jpg) no-repeat center top} .case_box ul li.case_4{background:url(http:/2014.igem.org/wiki/images/3/3e/BIT_2.jpg) no-repeat center top} .case_box ul li.case_5{background:url(http:/2014.igem.org/wiki/images/9/92/BIT_radiation1.jpg) no-repeat center top} .case_box ul li.case_6{background:url(http:/2014.igem.org/wiki/images/3/3e/BIT_2.jpg) no-repeat center top}

.case_box ul li.case_2 dl{margin-top:150px} .case_box ul li.case_3 dl{margin-top:135px} .case_box ul li.case_4 dl{margin-top:110px} .case_box ul li.case_5 dl{margin-top:120px} .case_box ul li.case_6 dl{margin-top:115px}

.case_info_add dd{line-height:22px}

.case_box ol{position:absolute;bottom:0;left:50%;margin:10px 0 0 -65px;height:12px;z-index:99;top: 235px;} .case_box ol li{float:left;margin:0 4px;display:inline;width:12px;height:12px;line-height:999em;background:url(../img/BIT_pagination.png) no-repeat;overflow:hidden;cursor:pointer;} .case_box ol li.active{background-position:0 -12px;}


</style>


</head>

<body>



  • </dd>
  • </dd>
  • </dd>
  • </dd>
  • </dd>
  • </dd>

Beijing Institute of Technology | 5 South Zhongguancun Street, Haidian DistrictBeijing, China 100081

E-mail: yifei0114@bit.edu.cn

Beijing Institute of Technology © 2014 Privacy Policy

<img style="width:1024px"src="BIT_line1.png">

<script type="text/javascript"> var Effect = (function() { 

   var Slider = function(o) {
       this.setting      = typeof o === 'object' ? o : {};
       this.target       = this.setting.target || 'slider';
       this.showMarkers  = this.setting.showMarkers || false;
       this.showControls = this.setting.showControls || false;
       this.timer        = null;
       this.currentTime  = null;
       this.ms           = 35;
       this.autoMs       = 3000;
       this.iTarget      = 0;
       this.nextTarget   = 0;
       this.speed        = 0;
       
       this.init();
       this.handleEvent();
   };
   
   Slider.prototype = {
       init: function() {
           this.obj      = document.getElementById(this.target);
           this.oUl      = this.obj.getElementsByTagName('ul')[0];
           this.aUlLis   = this.oUl.getElementsByTagName('li');
           this.width    = this.aUlLis[0].offsetWidth;
           this.number   = this.aUlLis.length;
           
           this.oUl.style.width = this.width * this.number + 'px';
           
           if(this.showMarkers) {
               var oDiv = document.createElement('div');
               var aLis = [];
               for(var i = 0; i < this.number; i++) {
aLis.push('
  • '+ (i+1) +'<\/li>'); }; oDiv.innerHTML = '
      '+ aLis.join() +'<\/ol>'; this.obj.appendChild(oDiv.firstChild); this.aLis = this.obj.getElementsByTagName('ol')[0].getElementsByTagName('li'); this.aLis[0].className = 'active'; oDiv = null; }; if(this.showControls) { this.oPrev = document.createElement('p'); this.oNext = document.createElement('p'); this.oPrev.className = 'prev'; this.oPrev.innerHTML = '«'; this.oNext.className = 'next'; this.oNext.innerHTML = '»'; this.obj.appendChild(this.oPrev); this.obj.appendChild(this.oNext); }; }, handleEvent: function() { var that = this; this.currentTime = setInterval(function() { that.autoPlay(); }, this.autoMs); this.addEvent(this.obj, 'mouseover', function() { clearInterval(that.currentTime); }); this.addEvent(this.obj, 'mouseout', function() { that.currentTime = setInterval(function() { that.autoPlay(); }, that.autoMs); }); if(this.showMarkers) { for(var i = 0; i < this.number; i++) { var el = this.aLis[i]; (function(index) { that.addEvent(el, 'mouseover', function() { that.goTime(index); }); })(i); }; }; if(this.showControls) { this.addEvent(this.oPrev, 'click', function() { that.fnPrev(); }); this.addEvent(this.oNext, 'click', function() { that.autoPlay(); }); }; }, addEvent: function(el, type, fn) { if(window.addEventListener) { el.addEventListener(type, fn, false); } else if(window.attachEvent) { el.attachEvent('on' + type, fn); }; }, fnPrev: function() { this.nextTarget--; if(this.nextTarget < 0) { this.nextTarget = this.number - 1; }; this.goTime(this.nextTarget); }, autoPlay: function() { this.nextTarget++; if(this.nextTarget >= this.number) { this.nextTarget = 0; }; this.goTime(this.nextTarget); }, goTime: function(index) { var that = this; if(this.showMarkers) { for(var i = 0; i < this.number; i++) { i == index ? this.aLis[i].className = 'active' : this.aLis[i].className = ; }; }; this.iTarget = -index * this.width; if(this.timer) { clearInterval(this.timer); }; this.timer = setInterval(function() { that.doMove(that.iTarget); }, this.ms); }, doMove: function(target) { this.oUl.style.left = this.speed + 'px'; this.speed += (target - this.oUl.offsetLeft) / 3; if(Math.abs(target - this.oUl.offsetLeft) === 0) { this.oUl.style.left = target + 'px'; clearInterval(this.timer); this.timer = null; }; } }; return { slider: function(o) { var tt = new Slider(o); } }; })(); Effect.slider({ 'targetElement': 'slider', 'showMarkers': true, 'showControls': true });</script>
    Retrieved from "http://2014.igem.org/Team:BIT/Team_3"