Biomod/2012/HKBU/BU Magician: Difference between revisions

From OpenWetWare
Jump to navigationJump to search
No edit summary
No edit summary
 
(144 intermediate revisions by the same user not shown)
Line 1: Line 1:
<div style="padding: 1px; color: #272727; background-color: #FFFFFF; width: 688px; align = center;">
<html>
[[Biomod/2012/HKBU/BU_Magician | <font face="trebuchet ms"  size = "2px" style="color:#272727"> '''Home''' </font>]] &nbsp;&nbsp;
<img src="http://openwetware.org/images/b/b8/HKBUlogo104.jpg" height="200" width="900"/>
[[Biomod/2012/HKBU/BU_Magician:Projects | <font face="trebuchet ms" size = "2px" style="color:#272727"> '''Projects''' </font>]] &nbsp;&nbsp;
</html>
[[Biomod/2012/HKBU/BU_Magician:Results | <font face="trebuchet ms" size = "2px" style="color:#272727"> '''Result&Analysis''' </font>]] &nbsp;&nbsp;
{{Template:HKBU2012}}
[[Biomod/2012/HKBU/BU_Magician:Members| <font face="trebuchet ms" size = "2px" style="color:#272727"> '''Team''' </font>]] &nbsp;&nbsp;
<html>
[[Biomod/2012/HKBU/BU_Magician:LabBook| <font face="trebuchet ms" size = "2px" style="color:#272727"> '''LabBook''' </font>]] &nbsp;&nbsp;
[[Biomod/2012/HKBU/BU_Magician:Extras| <font face="trebuchet ms" size = "2px" style="color:#272727"> '''Extras''' </font>]] &nbsp;&nbsp;
</div>
 
<!--
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>jOuery</title>
<link rel="stylesheet" href="style.css" />
<style>
<style>
.menu { height: 45px; display: block; }
.container{background-color: #ffffff; margin-top:0px}
.menu ul { list-style: none; padding: 0; margin: 0; }
#column-content {width: 0px; float: left; margin: 0 0 0 0;padding: 0;}
.menu ul li { float: left; /* 菜单子元素的内容超出不可见 */ 
.firstHeading {display:none; width:0px;}
overflow: hidden; position: relative; text-align: center; line-height: 45px; }
#column-one {display:none; width:0px;background-color: #ffffff;}
.menu ul li a { /* 必须是相对定位  */
position: relative; display: block; width: 110px; height: 45px; font-family: Arial; font-size: 11px; font-weight: bold; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; cursor: pointer; }
.menu ul li a span { /* 所有层将使用绝对定位 */
position: absolute; left: 0; width: 110px; }
.menu ul li a span.out { top: 0px; }
.menu ul li a span.over,  .menu ul li a span.bg { /* 起初.over层和.bg层相对a元素-45px以达到隐藏 */ 
top: -45px; }


/** 简化版示例 **/
#globalWrapper{width: 930px; background-color: #ffffff; margin-left: auto;margin-right: auto;
-moz-box-shadow: 0px 0px 15px #ccc;
#menu2 { background:#45A8DF; }
-webkit-box-shadow: 0px 0px 15px #ccc;
#menu2 ul li a { color:#FFF; }
box-shadow: 0px 0px 15px #ccc;}
#menu2 ul li a span.over { background: #A6DD00; color:#333; }
#menu2 ul li.nav1 a span.over { background: #fea274; }
#menu2 ul li.nav2 a span.over { background: #b0bbba; }
#menu2 ul li.nav3 a span.over { background: #a3f091; }
#menu2 ul li.nav4 a span.over { background: #86dbf9; }
#menu2 ul li.nav5 a span.over { background: #e0caf0; }
#menu2 ul li.nav6 a span.over { background: #9dace9; }
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script language="javascript">
$(document).ready(function() {
/* 简化版示例 */
$("#menu2 li a").wrapInner( '<span class="out"></span>' );
$("#menu2 li a").each(function() {
$('<span class="over">' +  $(this).text() + '</span>' ).appendTo( this );
});


$("#menu2 li a").hover(function() {
#content{ margin: 0 0 0 0; align: center; padding: 12px 12px 12px 12px; width:
$(".out",this).stop().animate({'top':'45px'},200); // 向下滑动 - 隐藏
$(".over",this).stop().animate({'top':'0px'},200); // 向下滑动 - 显示


}, function() {
800px;background-color: #ffffff; border: 0;}
$(".out",this).stop().animate({'top':'0px'},200); // 向上滑动 - 显示
#bodyContent{ width: 800px; align: center; background-color: #fffffff;}
$(".over",this).stop().animate({'top':'-45px'},200); // 向上滑动 - 隐藏
#column-content{width: 800px;background-color: #ffffff;}
});
.rotator{
    background-color:#222;
    width:800px;
    height:300px;
    margin:0px auto;
    position:relative;
    font-family:'Myriad Pro',Arial,Helvetica,sans-serif;
    color:#fff;
    text-transform:uppercase;
    letter-spacing:-1px;
    border:3px solid #f0f0f0;
    overflow:hidden;
    -moz-box-shadow:0px 0px 10px #222;
    -webkit-box-shadow:0px 0px 10px #222;
    box-shadow:0px 0px 10px #222;
}
img.bg{
    position:absolute;
    top:0px;
    left:0px;
}
.rotator ul{
    list-style:none;
    position:absolute;
    right:0px;
    top:0px;
    margin-top:6px;
    z-index:999999;
}
.rotator ul li{
    display:block;
    float:left;
    clear:both;
    width:260px;
}
.rotator ul li a{
    width:230px;
    float:right;
    clear:both;
    padding-left:10px;
    text-decoration:none;
    display:block;
    height:52px;
    line-height:52px;
    background-color:#222;
    margin:1px -20px 1px 0px;
    opacity:0.7;
    color:#f0f0f0;
    font-size:20px;
    border:2px solid #000;
    border-right:none;
    outline:none;
    text-shadow:-1px 1px 1px #000;
    -moz-border-radius:10px 0px 0px 20px;
    -webkit-border-top-left-radius:10px;
    -webkit-border-bottom-left-radius:20px;
    border-top-left-radius:10px;
    border-bottom-left-radius:20px;
}
.rotator ul li a:hover{
      text-shadow:0px 0px 2px #fff;
}
.rotator .heading{
    position:absolute;
    top:0px;
    left:0px;
    width:500px;
}
.rotator .heading h1{
    text-shadow:-1px 1px 1px #555;
    font-weight:normal;
    font-size:46px;
    padding:20px;
    color:orange;
}
.rotator .description{
    width:500px;
    height:80px;
    position:absolute;
    bottom:0px;
    left:0px;
    padding:20px;
    background-color:#222;
    -moz-border-radius:0px 10px 0px 0px;
    -webkit-border-top-right-radius:10px;
    border-top-right-radius:10px;
    opacity:0.7;
    border-top:2px solid #000;
    border-right:2px solid #000;
}
.rotator .description p{
    text-shadow:-1px 1px 1px #000;
    text-transform:none;
    letter-spacing:normal;
    line-height:26px;
}
a.more{
    color:orange;
    text-decoration:none;
    text-transform:uppercase;
    font-size:10px;
}
a.more:hover{
    color:#fff;
}
</style>
</head>
<body>


});


</script>
</head>
<body>


<div id="HEADER">
  <div id="menu2" class="menu" style="width: 708px">
    <ul>
      <li class="nav1"><a href="javascript:;">Home</a></li>
      <li class="nav2"><a href="Biomod/2012/HKBU/BU_Magician:Projects">Projects</a></li>
      <li class="nav3"><a href="javascript:;">JavaScript</a></li>
      <li class="nav4"><a href="javascript:;">Resources</a></li>
      <li class="nav5"><a href="javascript:;">Tutorials</a></li>
      <li class="nav6"><a href="javascript:;">About</a></li>
    </ul>
  </div>
</div>
</body>
</body>
</html>
</html>
-->
==<font face="trebuchet ms" size = "5.5px" style="color:#272727">Welcome to BU Magician Homepage </font>==
<div style="padding: 10px; color: #272727; background-color:#F0F0F0; width: 688px; align = center;">
<div style="padding: 10px; color: #272727; background-color:#FfFfFf; width: 800px; align = center; FONT-FAMILY: Helvetica; FONT-SIZE: 14px">Welcome to HKBU Magicians webpage 2012! This year, we conduct ''in vitro'' experiments to develop a simple yet effective method for self-assembling magnetic nanoparticle-based gene delivery.
== <font face="trebuchet ms" size = "5px" style="color:#272727">Welcome to BU Magician Homepage </font> ==
'''Project Highlights:''' <br/>
I work in the [[Your Lab]] at XYZ University.  I learned about [[OpenWetWare]] from From the wiki pages in Biomod competition 2011., and I've joined because To complete the wiki page required by the Biomod competition.
-Feasibility and low cost. <br/>
</div>
-Real ''in vitro'' experiment being conducted <br/>
<div style="padding: 10px; color: #272727; background-color:#F0F0F0; width: 688px; align = center;">
-Promising future application <br/>
== <font face="trebuchet ms" size = "5px" style="color:#272727">Abstract </font> ==
I work in the [[Your Lab]] at XYZ University.  I learned about [[OpenWetWare]] from From the wiki pages in Biomod competition 2011., and I've joined because To complete the wiki page required by the Biomod competition.
In this website, we will show you our ideas, design and results. Explore to find out more…
</div>


<div style="padding: 10px; color: #272727; background-color:#F0F0F0; width: 688px; align = center;">
----
== <font face="trebuchet ms" size = "5px" style="color:#272727">Video </font> ==
<html>
<html>
<object width="1000" height="900"><param name="movie" value="http://www.youtube.com/v/opVb89Cmrtkamp;hl=enamp;fs=1">
<img src="http://openwetware.org/images/a/a4/HKBU2012allfaculty.jpg" height="200" width="800"/>
  </param><param name="allowFullScreen" value="true">
<a href="http://openwetware.org/index.php?title=Biomod/2012/HKBU/BU_Magician&action=edit">have a try</a>
  </param><param name="allowscriptaccess" value="always"></param>
</html>
  <embed src="http://www.youtube.com/v/opVb89Cmrtk&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="600" height="500">
  </embed>
</object>
</div>

Latest revision as of 23:29, 24 October 2013

<html> <img src="http://openwetware.org/images/b/b8/HKBUlogo104.jpg" height="200" width="900"/> </html> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>jOuery</title> <link rel="stylesheet" href="style.css" /> <style> .menu { height: 45px; display: block; } .menu ul { list-style: none; padding: 0; margin: 0; } .menu ul li { float: left; overflow: hidden; position: relative; text-align: center; line-height: 45px; } .menu ul li a { position: relative; display: block; width: 128px; height: 45px; font-family: Arial; font-size: 11px; font-weight: bold; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; cursor: pointer; } .menu ul li a span { position: absolute; left: 0; width: 128px; } .menu ul li a span.out { top: 0px; } .menu ul li a span.over, .menu ul li a span.bg { top: -45px; }


  1. menu2 { background:#45A8DF; }
  2. menu2 ul li a { color:#FFF; }
  3. menu2 ul li a span.over { background: #A6DD00; color:#333; }
  4. menu2 ul li.nav1 a span.over { background: #fea274; }
  5. menu2 ul li.nav2 a span.over { background: #b0bbba; }
  6. menu2 ul li.nav3 a span.over { background: #a3f091; }
  7. menu2 ul li.nav4 a span.over { background: #86dbf9; }
  8. menu2 ul li.nav5 a span.over { background: #e0caf0; }
  9. menu2 ul li.nav6 a span.over { background: #9dace9; }
  10. menu2 ul li.nav7 a span.over { background: #FFE66F; }

</style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script> <script language="javascript"> $(document).ready(function() {


$("#menu2 li a").wrapInner( '<span class="out"></span>' );

$("#menu2 li a").each(function() { $('<span class="over">' + $(this).text() + '</span>' ).appendTo( this ); });

$("#menu2 li a").hover(function() { $(".out",this).stop().animate({'top':'45px'},200); $(".over",this).stop().animate({'top':'0px'},200);

}, function() { $(".out",this).stop().animate({'top':'0px'},200); $(".over",this).stop().animate({'top':'-45px'},200); });

});

</script> </head> <body> <div id="HEADER"> 

 <div id="menu2" class="menu" style="width: 897px">
   <ul>
     <li class="nav1"><a href="http://openwetware.org/wiki/Biomod/2012/HKBU/BU_Magician">Home</a></li>
     <li class="nav2"><a href="http://openwetware.org/wiki/Biomod/2012/HKBU/BU_Magician:Projects">Projects</a></li>
     <li class="nav3"><a href="http://openwetware.org/wiki/Biomod/2012/HKBU/BU_Magician:Results">ResultS</a></li>
      <li class="nav7"><a href="http://openwetware.org/wiki/Biomod/2012/HKBU/BU_Magician:Methods">Methods</a></li>
     <li class="nav4"><a href="http://openwetware.org/wiki/Biomod/2012/HKBU/BU_Magician:Team">Team</a></li>
     <li class="nav5"><a href="http://openwetware.org/wiki/Biomod/2012/HKBU/BU_Magician:Labook:Notebook/Labbook">Labook</a></li>
     <li class="nav6"><a href="http://openwetware.org/wiki/Biomod/2012/HKBU/BU_Magician:Extra">Extra</a></li>
   </ul>
 </div>

</div> </body> </html> <html> <head> <style> .container{background-color: #ffffff; margin-top:0px}

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

.firstHeading {display:none; width:0px;}

  1. column-one {display:none; width:0px;background-color: #ffffff;}
  1. globalWrapper{width: 930px; background-color: #ffffff; margin-left: auto;margin-right: auto;

-moz-box-shadow: 0px 0px 15px #ccc; -webkit-box-shadow: 0px 0px 15px #ccc; box-shadow: 0px 0px 15px #ccc;}

  1. content{ margin: 0 0 0 0; align: center; padding: 12px 12px 12px 12px; width:

800px;background-color: #ffffff; border: 0;}

  1. bodyContent{ width: 800px; align: center; background-color: #fffffff;}
  2. column-content{width: 800px;background-color: #ffffff;}

.rotator{ 

   background-color:#222;
   width:800px;
   height:300px;
   margin:0px auto;
   position:relative;
   font-family:'Myriad Pro',Arial,Helvetica,sans-serif;
   color:#fff;
   text-transform:uppercase;
   letter-spacing:-1px;
   border:3px solid #f0f0f0;
   overflow:hidden;
   -moz-box-shadow:0px 0px 10px #222;
   -webkit-box-shadow:0px 0px 10px #222;
   box-shadow:0px 0px 10px #222;

} img.bg{ 

   position:absolute;
   top:0px;
   left:0px;

} .rotator ul{ 

   list-style:none;
   position:absolute;
   right:0px;
   top:0px;
   margin-top:6px;
   z-index:999999;

} .rotator ul li{ 

   display:block;
   float:left;
   clear:both;
   width:260px;

} .rotator ul li a{ 

   width:230px;
   float:right;
   clear:both;
   padding-left:10px;
   text-decoration:none;
   display:block;
   height:52px;
   line-height:52px;
   background-color:#222;
   margin:1px -20px 1px 0px;
   opacity:0.7;
   color:#f0f0f0;
   font-size:20px;
   border:2px solid #000;
   border-right:none;
   outline:none;
   text-shadow:-1px 1px 1px #000;
   -moz-border-radius:10px 0px 0px 20px;
   -webkit-border-top-left-radius:10px;
   -webkit-border-bottom-left-radius:20px;
   border-top-left-radius:10px;
   border-bottom-left-radius:20px;

} .rotator ul li a:hover{ 

     text-shadow:0px 0px 2px #fff;

} .rotator .heading{ 

   position:absolute;
   top:0px;
   left:0px;
   width:500px;

} .rotator .heading h1{ 

   text-shadow:-1px 1px 1px #555;
   font-weight:normal;
   font-size:46px;
   padding:20px;
   color:orange;

} .rotator .description{ 

   width:500px;
   height:80px;
   position:absolute;
   bottom:0px;
   left:0px;
   padding:20px;
   background-color:#222;
   -moz-border-radius:0px 10px 0px 0px;
   -webkit-border-top-right-radius:10px;
   border-top-right-radius:10px;
   opacity:0.7;
   border-top:2px solid #000;
   border-right:2px solid #000;

} .rotator .description p{ 

   text-shadow:-1px 1px 1px #000;
   text-transform:none;
   letter-spacing:normal;
   line-height:26px;

} a.more{ 

   color:orange;
   text-decoration:none;
   text-transform:uppercase;
   font-size:10px;

} a.more:hover{ 

   color:#fff;

} </style> </head> <body>


</body> </html>

Welcome to BU Magician Homepage

Welcome to HKBU Magicians webpage 2012! This year, we conduct in vitro experiments to develop a simple yet effective method for self-assembling magnetic nanoparticle-based gene delivery.

Project Highlights:
-Feasibility and low cost.
-Real in vitro experiment being conducted
-Promising future application

In this website, we will show you our ideas, design and results. Explore to find out more…

<html> <img src="http://openwetware.org/images/a/a4/HKBU2012allfaculty.jpg" height="200" width="800"/> <a href="http://openwetware.org/index.php?title=Biomod/2012/HKBU/BU_Magician&action=edit">have a try</a> </html>

Retrieved from "https://openwetware.org/mediawiki/index.php?title=Biomod/2012/HKBU/BU_Magician&oldid=744678"