Biomod/2011/TUM/TNT/Home

From OpenWetWare
Revision as of 14:22, 14 September 2011 by Sarah Hintermayer (talk | contribs)
Jump to navigationJump to search

<html> <style>

  1. column-one {
   display:none;
   width:0px;

}

  1. menu{

width:800px margin:auto; padding:auto; }

  1. content {
  width: 0px;
  margin: 0 auto auto 0;
  padding: 1em 1em 1em 1em;
  position: center;
}
  1. column-content {
  width: 0px;
  float: left;
  margin: 0 0 0 0;
  padding: 0;

}

.firstHeading {

   display:none;
   width:0px;

}

  1. globalWrapper{
  width:800px;

}


  1. column-one {
   display:none;
   width:0px;

}

  1. content{
  margin: 0 0 0 0;
  padding: 1em 1em 1em 1em;
  position: center;
  width: 800px;
}

.container{

   width: 800px;
   margin: auto;
   background-color: #f5f5f5;
   text-align:justify;
   font-family: helvetica, arial, sans-serif;
   color:#555555;
   margin-top:25px; 

}

  1. bodyContent{
  width: 800px;
  position: center;

}

  1. column-content{
  width: 800px

} .firstHeading {

   display:none;
   width:0px;

}

  1. header{
  position: center;
  width: 800px;

}

  1. nav li {
 /* floaten der Hauptlistenpunkte */
 margin: 0;
 float: left;
 display: block;
 padding-right: 15px;

}

  1. nav li.off ul, #nav li.on ul {
 /* Verstecken der Untermenüs */
 display: none;

}

  1. nav li a {
 /* Für alle Links in der Liste */
 color: #f90;
 font-weight: bold;
 display: block;
 height: 15px;
 width: 100px;
 border: 1px solid #29497b;
 padding: 5px;

}

  1. nav li.off ul, #nav li.on ul {
 /* Subnavs positionieren und verstecken */
 display: none;
 position: absolute;
 top: 500px;
 height: 15px;
 left: 0;
 padding-top: 10px;

}

  1. nav li.on a {
 /* Rahmenfarbe für aktive Fläche ändern */
 border: 1px solid #f90;

}

  1. nav li.on ul a, #nav li.off ul a {
 /* Vererbung des Rahmens für Untermenü
    des aktiven Themas unterdrücken */
 border: 0;

}

  1. nav li.on ul {
 /* Liste des aktiven Untermenüs ausgeben */
 display: block;

}

  1. nav li.on ul a, #nav li.off ul a {
 float: left;
 /* IE vererbt den Float nicht */
 border: 0;
 color: #f90;
 width: auto;
 margin-right: 15px;

}

  1. nav li.on ul {
 /* Aktuelle Thema anzeigen */
 display: block;

}

  1. nav li.off:hover ul {
 /* Die anderen Themen anzeigen
    bei hover über dem Elternmenü */
 display: block;
 z-index: 6000;

}

  1. nav li.off a:hover, #nav li.off:hover a {
 background: #29497b;
 color: #f90;

}

  1. nav li.off ul, #nav li.on ul {
 /* Subnav nach unten verschieben */
 top: 33px;
 *top: 44px; /* Repositionierung für IE */

}

startList = function() { if (document.all && document.getElementById) { navRoot = document.getElementById("nav"); for (i=0; i<navRoot.childNodes.length; i++) {

 node = navRoot.childNodes[i];
 if (node.nodeName=="LI") {
 node.onmouseover=function() {
 this.className+=" over";
   }
 node.onmouseout=function() {
 this.className=this.className.replace
     (" over", "");
  }
  }
 }
}

} window.onload=startList;

  1. nav li.off:hover ul, #nav li.over ul {
 display: block;
 z-index: 6000;

}

  1. nav li.off a:hover,
  2. nav li:hover a,
  3. nav li.over a {
 background: #29497b;
 color: #f90;

}

</style>

<head>


<title>

       TUM NanU - Home   

</title> </head>

<body bgcolor="#F0F0F0"> <!-- Header--> <div class="container">

   <div id="header">
       <img src="http://openwetware.org/images/5/5c/Header2.png" />
   </div> 
   

<!--Menue--> <div id="menu"> <ul id="nav"> <li class="off"><a href="#">Renaissance</a> <ul>

 <li><a href="#">Brunelleschi</a></li>
 <li><a href="#">Alberti</a></li>
 <li><a href="#">Palladio</a></li>
 <li><a href="#">Michelangelo</a></li>
 <li><a href="#">Bramante</a></li>

</ul></li> <li class="off"><a href="#">Art Nouveau</a> <ul>

 <li><a href="#">Mackintosh</a></li>
 <li><a href="#">Guimard</a></li>
 <li><a href="#">Horta</a></li>
 <li><a href="#">van de Velde</a></li>

</ul></li> <li class="on"><a href="#">Modern</a> <ul>

 <li><a href="#">Sullivan</a></li>
 <li><a href="#">Le Corbusier</a></li>
 <li><a href="#">Mies</a></li>
 <li><a href="#">Gropius</a></li>
 <li><a href="#">Yamasaki</a></li>

</ul></li> <li class="off"><a href="#">Postmodern</a> <ul>

 <li><a href="#">Venturi</a></li>
 <li><a href="#">Eisenman</a></li>
 <li><a href="#">Stern</a></li>
 <li><a href="#">Graves</a></li>
 <li><a href="#">Gehry</a></li>

</ul></li> <li class="off"><a href="#">Digital</a> <ul>

 <li><a href="#">Xenakis</a></li>
 <li><a href="#">Lynn</a></li>
 <li><a href="#">Diller+Scofidio</a></li>
 <li><a href="#">Zellner</a></li>
 <li><a href="#">Hadid</a></li>

</ul></li> </ul>

</div>

</div> </body> </html>

Abstract Links
Welcome to the TUM Biomod project 2011! It was a ......... Here's a brief introduction…

“Zitat- falls jemand was gutes kennt” - xy

Nanobiology offers a great opportunity to design anything you can imagine. At the beginning of this project we there were many ideas we discussed and finally we decided to build a DNA based sensor. We wanted to design a structure, that enables you to identify the influence DNA intercalating or binding molecules have on twist and length of the DNA using FRET labeld staples. The advantage of FRET on the one hand is the easy detection via flourecent measurements and on the other hand the easy positioning of the labels on the structur. The TEM pictures we took are a control to confirm our results from the FRET experiments.

You can take a look at our structure below. Follow the link to take a quick tour of the wiki. The links on the right lead to elements we think might beinteresting additions to the core project. Or just head for the main menu above if you know what you're looking for.


<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
 <script type="text/javascript">
  $(document).ready(function(){
   $('#lside1').mouseover(function() {
    $('#lside1').stop().animate({backgroundPosition: '0px 0px'}, 1000);
   });
   $('#lside1').mouseleave(function() {
    $('#lside1').stop().animate({backgroundPosition: '-250px 0px'}, 1000);
   });
   $('#lside2').mouseover(function() {
    $('#lside2').stop().animate({backgroundPosition: '0px 0px'}, 1000);
   });
   $('#lside2').mouseleave(function() {
    $('#lside2').stop().animate({backgroundPosition: '-250px 0px'}, 1000);
   });
   $('#lside3').mouseover(function() {
    $('#lside3').stop().animate({backgroundPosition: '0px 0px'}, 1000);
   });
   $('#lside3').mouseleave(function() {
    $('#lside3').stop().animate({backgroundPosition: '-250px 0px'}, 1000);
   });
  });
 </script>
 <style type="text/css">
  #side1 {
   width: 250px;
   height: 100px;
   position: relative;
   top: 0px;
   left: 0px;}
  #lside1 {
   width: 250px;
   height: 100px;
   background: url(http://www.tftshop.net/Testbild_100ppi.jpg) -250px 0px no-repeat;
   position: absolute;
   top: 0px;
   left: 0px;}
  #side2 {
   width: 250px;
   height: 100px;
   position: relative;
   top: 110px;
   left: 0px;}
  #lside2 {
   width: 250px;
   height: 100px;
   background: url(http://www.tftshop.net/Testbild_100ppi.jpg) -250px 0px no-repeat;
   position: absolute;
   top: 0px;
   left: 0px;}
  #side3 {
   width: 250px;
   height: 100px;
   position: relative;
   top: 110px;
   left: 0px;}
  #lside3 {
   width: 250px;
   height: 100px;
   background: url(http://www.tftshop.net/Testbild_100ppi.jpg) -250px 0px no-repeat;
   position: absolute;
   top: 0px;
   left: 0px;}
 </style>
</head>
<body>
 <div id='side1'>
  <a

href='http://2010.igem.org/Team:Imperial_College_London/Software_Tool' id='lside1'></a>

  <div id='side2'>
   <a href='http://2010.igem.org/Team:Imperial_College_London/Software_Tool' id='lside1'></a>
   <div id='side3'>
    <a href='http://2010.igem.org/Team:Imperial_College_London/Software_Tool' id='lside1'></a>
   </div>
  </div>
 </div>
</body>

</html>

Take the tour...
Structure
<html>


//<link rel="stylesheet" type="text/css" href="slider/css/slider.css" /> //<script type="text/javascript" src="slider/js/mootools.js"></script> //<script type="text/javascript" src="more.js"></script> //<script type="text/javascript" src="slider/js/slider.js"></script>

//<!-- ### Slideshow Code Anfang ### -->

<div id="nunodesign_contentSlider"> <div id="nd_contentSlider_linkBox">


</div><br style="clear:both;" /> </div> <div id="nunodesign_contentSlider_switcher"> <p> <img src="images/closepfeil.png" alt="closebutton" /> <span id="nd_contentSlider_closeButton" style=" margin-top:0px;;">close</span> </p> <span id="nd_contentSlider_creditsButton">+</span>

</div>


//<!-- ### Slideshow Code Ende ### -->


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

$(document).ready(function(){
 $('#mainpic').attr('src', 

'http://www.tftshop.net/Testbild_100ppi.jpg');

 $('#mainpic').attr('src', 

'http://australian-kanguru-watchers.de/wp-content/uploads/2009/11/dnet24-testbild.jpg');

 $('#mainpic').attr('src', 

'http://eschbaer.de/wp-content/uploads/final_testbild.png');

 $('#mainpic').attr('src', 

'http://www.media-digest.com/wp-content/uploads/2009/05/test-pattern-briefs.jpg');

 $("#but1").mouseenter(function() {
  $('#mainpic').attr('src', 'http://www.cnet.co.uk/i/c/rv/e/digitalcameras/fujifilm/finepix_f200exr/f200exrstorygraphic1large.jpg');
 });
 $("#but2").mouseenter(function() {
  $('#mainpic').attr('src', 

'http://xmas.tfoe.net/img/testbild.jpg');

 });
 $("#but3").mouseenter(function() {
  $('#mainpic').attr('src', 

'http://www.tv-testbild.com/bilder/nbc-320.jpg');

 });
 $("#but4").mouseenter(function() {
  $('#mainpic').attr('src', 

'http://www.tv-testbild.com/pictures/orf2.jpg');

 });
});

</script> <style type="text/css">

#maincon {
 width:800px;
 position:relative;}
#mainpic {
 width:800px;}
#but1 {
 width:60px;
 height:60px;
 position:absolute;
 left:88px;
 top:19px;
 z-index:2;
 background-image:url('http://2010.igem.org/wiki/images/b/b7/ICblank.png');}
#but2 {
 width:60px;
 height:60px;
 position:absolute;
 left:489px;
 top:220px;
 z-index:2;
 background-image:url('http://2010.igem.org/wiki/images/b/b7/ICblank.png');}
#but3 {
 width:60px;
 height:60px;
 position:absolute;
 left:320px;
 top:302px;
 z-index:2;
 background-image:url('http://2010.igem.org/wiki/images/b/b7/ICblank.png');}
#but4 {
 width:60px;
 height:60px;
 position:absolute;
 left:509px;
 top:4px;
 z-index:2;
 background-image:url('http://2010.igem.org/wiki/images/b/b7/ICblank.png');}

</style>

<div id="maincon">
<img id="mainpic" />
 <div id="but1">
 </div>
 <div id="but2">
 </div>
 <div id="but3">
 </div>
 <div id="but4">
 </div>
</div>

</html>


About Biomod Sponsored By
The Biomod is ……… competition. Student teams are given the opportunity to……... Working at their own schools over the summer, they design……………. This project design and competition offers the unique opportunity to………..

<html>

<a href="http://www.wdrmaus.de/">
 <img src="http://www.aba-fachverband.org/uploads/RTEmagicC_Logo_Maus.gif.gif" />
</a>

</html>

<html>
<a href="http://www.wdrmaus.de/">
 <img src="http://www.aba-fachverband.org/uploads/RTEmagicC_Logo_Maus.gif.gif" />
</a>

</html>

<html>
<a href="http://openwetware.org/index.php?title=Biomod/2011/TUM/TNT/Maus">
 <img src="http://www.aba-fachverband.org/uploads/RTEmagicC_Logo_Maus.gif.gif" />
</a>

</html>