Biomod/2012/OSU/OhioMOD: Difference between revisions

From OpenWetWare
Jump to navigationJump to search
No edit summary
No edit summary
Line 1: Line 1:
<html>
<html>
  <head>
<head>
  <link rel="stylesheet" href="http://dl.dropbox.com/s/y6lp9909xs10md7/flexslider.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
  <style type="text/css">
<script type="text/javascript" src="http://dl.dropbox.com/s/piaqef6ntvm0hnn/jquery.queryloader2.js"></script> <!-- progress preloading-->
/* PAGE LAYOUT STYLES */
body {
<script type"text/javascript">
margin: 0;
$(document).ready(function () {
font-family: arial, sans-serif;
$("body").queryLoader2({barColor: "#FFF",backgroundColor: "#000",percentage: true,barHeight: 1,completeAnimation: "grow",minimumTime: 100});  
background: #FFF;
$("style").remove();
}
$('head').append('<link rel="stylesheet" href="/skins/monobook/shared.css?164" type="text/css" />');
header {
$("#sidebar-main").remove();
text-align:center;
$(".portlet").remove();
padding:0px 0 0 0;
background-color:#fff;
}
#wrapper {
position:relative;
width:100%;
background:#000;
}
#main {
width:100%;
margin: 0px;
background-image:url(img/background_v2.svg);
padding:0px;
}
.section {
min-height: 600px;
padding-top: 1px;
/*background-image:url(img/background_v2.svg);*/
color:#fff;
}
/* NAVIGATION STYLES */
.standardNav ul {
display: block;
margin: 0;
padding: 6px;
list-style:none;
padding-left:100px;
/*-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;*/
background: #333;
}
.standardNav li {
display: inline-block;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
width:125px;
}
.standardNav li a {
color:#9e9e9e;
padding: 8px 10px;
text-decoration: none;
font-size: 14px;
font-family:"ff-din-web-pro", sans-serif;
font-style:normal;
font-weight:400;
}
.standardNav li a:hover {
color: #FFF;
}
.standardNav li.active a {
color: #FFF;
font-family:"ff-din-web-pro", sans-serif;
font-style:normal;
font-weight:400;
}
nav {
font-family:"ff-din-web-pro", sans-serif;
font-style:normal;
font-weight:400;
color:#9e9e9e;
font-weight:bold;
height: 60px;
width: 100%;
line-height:30px;
position: relative;
z-index:9999999;
}
nav p {
padding: 0 70px;
}
nav a {
font-family:"ff-din-web-pro", sans-serif;
font-style:normal;
font-weight:400;
color:#9e9e9e;
text-shadow: 0 0 0 transparent, 0 -1px 1px #333;
}
#nav_biomod {
float:right;
}
h1 {
color:#7f7f7f;
font-size:20px;
font-weight:normal;
letter-spacing:2px;
line-height:18px;
padding-top:50px;
text-align:center;
text-transform:uppercase;
font-family:"ff-din-web-condensed", sans-serif;
font-style:normal;
font-weight:400;
}
.fixed {
position:fixed;
}
#team_slider {
padding-top:50px;
width:800px;
}
</style>
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script type="text/javascript" src="http://dl.dropbox.com/s/osh1gymcc7eyddv/jquery.pagescroller.lite.js"></script>
  <script src="http://dl.dropbox.com/s/3ej7jws4d4r4stu/jquery.flexslider-min.js"></script>
  <script src="http://dl.dropbox.com/s/ii3bdcd8mydr89k/jquery.flexslider.js"></script>
  <script type="text/javascript" src="http://dl.dropbox.com/s/piaqef6ntvm0hnn/jquery.queryloader2.js"></script>
 
  <script type="text/javascript">
    $(window).load(function(){
  $('.flexslider').flexslider({
    animation: "slide",
    controlNav: "thumbnails"
  });
    });
  </script>
 
  <script type="text/javascript">
var winW = 800, winH = 600;
if (document.body && document.body.offsetWidth) {
winW = document.body.offsetWidth;
winH = document.body.offsetHeight;
}
if (document.compatMode=='CSS1Compat' &&
    document.documentElement &&
    document.documentElement.offsetWidth ) {
winW = document.documentElement.offsetWidth;
winH = document.documentElement.offsetHeight;
}
if (window.innerWidth && window.innerHeight) {
winW = window.innerWidth;
winH = window.innerHeight;
if (window.innerHeight<800) {winH = 800;}
}
$(document).ready(function(){
$("style").remove();
$("#sidebar-main").remove();
$(".portlet").remove();
$("#contentSub").remove();
$("#contentSub").remove();
$("#jump-to-nav").remove();
$("#jump-to-nav").remove();
Line 160: Line 17:
$("#footer").remove();
$("#footer").remove();
$(".printfooter").remove();
$(".printfooter").remove();
/* $("body").queryLoader2({barColor: "#FFF",backgroundColor: "#000",percentage: true,barHeight: 1,completeAnimation: "grow",minimumTime: 100}); */
$('head').append('<link rel="stylesheet" href="/skins/monobook/shared.css?164" type="text/css" />');
var aboveHeight = $('header').outerHeight();
var aboveHeight = $('header').outerHeight();
// initiate page scroller plugin
$('body').pageScroller({
navigation: '#nav'
});
});
 
$(".section").height(winH);
$('#team_slider').width(winW-450);
$('header').height(winH-44);
document.getElementById('frontvar').style.paddingTop =(winH/3-22)+"px";
//Calculate the height of <header>
//Use outerHeight() instead of height() if have padding
    var aboveHeight = winH-22;//$('header').height()+1050;
// when scroll
     $(window).scroll(function(){
     $(window).scroll(function(){
//if scrolled down more than the header's height
//if scrolled down more than the header's height
Line 187: Line 28:
         } else {
         } else {
// when scroll up or less than aboveHeight, remove the "fixed" class, and the padding-top
// when scroll up or less than aboveHeight, remove the "fixed" class, and the padding-top
             $('nav').removeClass('fixed').next().css('padding-top','0px');
             $('nav').removeClass('fixed').next().css('padding-top','0');
         }
         }
     });
     });
</script>
// for the window resize
 
$(window).resize(function() {
<style>
var winW = 800, winH = 600;
header {
if (document.body && document.body.offsetWidth) {
text-align:center;
winW = document.body.offsetWidth;
padding:70px 0;
winH = document.body.offsetHeight;
}
}
if (document.compatMode=='CSS1Compat' &&
</style>
    document.documentElement &&
</head>
    document.documentElement.offsetWidth ) {
winW = document.documentElement.offsetWidth;
winH = document.documentElement.offsetHeight;
}
if (window.innerWidth && window.innerHeight) {
winH = window.innerHeight;
winW = window.innerWidth;
if (window.innerHeight<800) {winH = 800;}
}
    $(".section").height(winH);
$('header').height(winH-44);
$('#team_slider').width(winW-550);
document.getElementById('frontvar').style.paddingTop =(winH/3-22)+"px";
//Calculate the height of <header>
//Use outerHeight() instead of height() if have padding
    var aboveHeight = winH-44;//$('header').height()+1050;
// when scroll
    $(window).scroll(function(){
//if scrolled down more than the header's height
        if ($(window).scrollTop() > aboveHeight){
// if yes, add "fixed" class to the <nav>
// add padding top to the #content (value is same as the height of the nav)
            $('nav').addClass('fixed').css('top','0px').next().css('padding-top','60px');
        } else {
// when scroll up or less than aboveHeight, remove the "fixed" class, and the padding-top
            $('nav').removeClass('fixed').next().css('padding-top','00px');
        }
    });
});
});


</script>
<body>
  </head>


  <body>
<nav>
<header>
    <p><a href="#">Sample navigation bar</a></p>
    <center>
    </nav>
    <img id="frontvar" src="http://dl.dropbox.com/s/5ye82pz6sieqlzy/front_logo.jpg"/>
  </center>
  </header>
<div id="wrapper">
    <nav>
    <div id="nav" class="standardNav">
        <ul>
        <li><a href="#">#Background</a></li>
        <li><a href="#">#Project</a></li>
        <li><a href="#">#Methods</a></li>
        <li><a href="#">#Results</a></li>
        <li><a href="#">#Resources</a></li>
        <li><a href="#">#The Team</a></li>
      </ul>
        <div id="nav_biomod"><img src="http://dl.dropbox.com/s/s986aya26k1bbiu/nav_footer.png"></div>
      </div>
  </nav>
    <div id="main">
    <div class="section">
        <h1>Background</h1>
      </div>
    <div class="section">
        <h1>Project</h1>
      </div>
    <div class="section">
        <h1>Methods</h1>
      </div>
    <div class="section">
        <h1>Results/Discussion</h1>
      </div>
    <div class="section">
        <h1>Resources</h1>
      </div>
    <div class="section">
        <h1>The Team</h1>
        <center>
        <div id="team_slider" role="team_slider">
        <section class="slider">
            <div class="flexslider">
            <ul class="slides">
                <li data-thumb="http://dl.dropbox.com/s/fpobpvxondszu99/theteam_nav.jpg"> <img src="http://dl.dropbox.com/s/3v3ra748y0px1sk/hjgj.jpg"></li>
                <li data-thumb="http://dl.dropbox.com/s/c1lakz9038tctat/castro_nav.jpg"> <img src="http://dl.dropbox.com/s/dludspdi4kgt8m6/castro_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/wucsphgdkswuter/hudoba_nav.jpg"> <img src="http://dl.dropbox.com/s/kn6s88wtb7t9ex6/hudoba_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/qv2vpqo2fqzgchy/marras_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/z0fxjhc3qshb79r/autran_nav.jpg"> <img src="http://dl.dropbox.com/s/1ee9xvpinxxsh15/autran_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/3mxgbma3ytfm61s/bossart_nav.jpg"> <img src="http://dl.dropbox.com/s/lsty77hjlc5f19i/bossart_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/rto7gtk9cv97g3e/brockman_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/2ur94d8koicrnx0/crawford_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/dsdnsrxcubk08en/justus_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/pfckd5kuddq3xh9/lynch_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/wsvj1mxw1sc157c/marquart_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/s57dszk8rnoay1i/morales_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/xrnssm96cd7kd26/sohutskay_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
                <li data-thumb="http://dl.dropbox.com/s/2xt1g8j6rk7uvxu/viznyuk_nav.jpg"> <img src="http://dl.dropbox.com/s/gohlgd0xed4zedg/marras_slide.jpg" /> </li>
              </ul>
          </div>
          </section>
          </div>
          </center>
      </div>
      </div>
  </div>
    <!-- [END] #main -->
  </div>
<!-- [END] #wrapper -->


*Team Name: OhioMOD
*Institution:
**The Ohio State University, Columbus OH, USA
*Faculty Advisor:
**Dr. Carlos Castro
*Graduate Advisors:
**Mike Hudoba
**Alex Marras
*Team Members:
**Alex Autran
**Jimmy Bossart
**Josh Brockman
**Bridget Crawford
**Nick Justus
**Matt Lynch
**Kedryn Marquart
**Eisman Morales
**David Sohutskay
**Marty Spang
**Mike Viznyuk
| [[Image:OhioMOD First Team Photo.jpg|550px]]
<br/>
The Ohio State University — OhioMOD<br/>
'''Title:''' A Framework for Assembling and Reconfiguring DNA Origami Containers<br/>
'''Abstract:''' Previous DNA origami research has illustrated a wide array of 3D structures. Typically, folding multiple objects requires ordering a new set of DNA components for each desired structure. This project seeks to overcome this limitation by developing a hierarchical assembly framework where multiple 3D shapes can be constructed from a single base DNA origami structure. The basic shape is constructed by folding four equilateral triangles from a single DNA origami scaffold and then arranging them into a parallelogram. Schematics were created to fold these parallelograms into four nanoscale container-like shapes: a tetrahedron, an octahedron, an icosahedron, and a wheel. These final shapes are composed of triangles joined by double stranded DNA connections that can be disrupted utilizing DNA strand displacement to ultimately reconfigure a given shape into a different 3D shape (i.e. reconfigure an octahedron to an icosahedron). This project will enable an economic framework to fabrication of multiple DNA origami structures. Furthermore, this approach could be used to develop DNA structures that can reconfigure in response to a biological stimulus, for example cancer cell microenvironments, for drug delivery applications.
</body>
</body>
</html>
</html>

Revision as of 09:27, 22 October 2012

<html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="http://dl.dropbox.com/s/piaqef6ntvm0hnn/jquery.queryloader2.js"></script> <!-- progress preloading-->

<script type"text/javascript"> $(document).ready(function () { $("body").queryLoader2({barColor: "#FFF",backgroundColor: "#000",percentage: true,barHeight: 1,completeAnimation: "grow",minimumTime: 100}); $("style").remove(); $('head').append('<link rel="stylesheet" href="/skins/monobook/shared.css?164" type="text/css" />'); $("#sidebar-main").remove(); $(".portlet").remove(); $("#contentSub").remove(); $("#jump-to-nav").remove(); $("#siteSub").remove(); $(".firstHeading").remove(); $("#footer").remove(); $(".printfooter").remove(); var aboveHeight = $('header').outerHeight(); });

   $(window).scroll(function(){

//if scrolled down more than the header's height

       if ($(window).scrollTop() > aboveHeight){

// if yes, add "fixed" class to the <nav> // add padding top to the #content (value is same as the height of the nav)

           $('nav').addClass('fixed').css('top','0').next().css('padding-top','60px');
       } else {

// when scroll up or less than aboveHeight, remove the "fixed" class, and the padding-top

           $('nav').removeClass('fixed').next().css('padding-top','0');
       }
   });

</script>

<style> header { text-align:center; padding:70px 0; } </style> </head>

<body>

<nav>

   	<p><a href="#">Sample navigation bar</a></p>
   </nav>
  • Team Name: OhioMOD
  • Institution:
    • The Ohio State University, Columbus OH, USA
  • Faculty Advisor:
    • Dr. Carlos Castro
  • Graduate Advisors:
    • Mike Hudoba
    • Alex Marras
  • Team Members:
    • Alex Autran
    • Jimmy Bossart
    • Josh Brockman
    • Bridget Crawford
    • Nick Justus
    • Matt Lynch
    • Kedryn Marquart
    • Eisman Morales
    • David Sohutskay
    • Marty Spang
    • Mike Viznyuk

| [[Image:OhioMOD First Team Photo.jpg|550px]] <br/> The Ohio State University — OhioMOD<br/> '''Title:''' A Framework for Assembling and Reconfiguring DNA Origami Containers<br/> '''Abstract:''' Previous DNA origami research has illustrated a wide array of 3D structures. Typically, folding multiple objects requires ordering a new set of DNA components for each desired structure. This project seeks to overcome this limitation by developing a hierarchical assembly framework where multiple 3D shapes can be constructed from a single base DNA origami structure. The basic shape is constructed by folding four equilateral triangles from a single DNA origami scaffold and then arranging them into a parallelogram. Schematics were created to fold these parallelograms into four nanoscale container-like shapes: a tetrahedron, an octahedron, an icosahedron, and a wheel. These final shapes are composed of triangles joined by double stranded DNA connections that can be disrupted utilizing DNA strand displacement to ultimately reconfigure a given shape into a different 3D shape (i.e. reconfigure an octahedron to an icosahedron). This project will enable an economic framework to fabrication of multiple DNA origami structures. Furthermore, this approach could be used to develop DNA structures that can reconfigure in response to a biological stimulus, for example cancer cell microenvironments, for drug delivery applications. </body> </html>