Team:OUC-China/BaoYingying

From 2012.igem.org

(Difference between revisions)
 
(8 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
<head>
<head>
-
<meta charset="UTF-8">
+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">  
-
<title>Creating "Next Level" Search Form Using jQuery & CSS3 | Webstuffshare.com</title>
+
<link rel="stylesheet" href="http://1.oucigem.sinaapp.com/oucigem2012-nav.css"><!--nav logo demo css-->
-
<meta name="description" content="Tutorial : Creating Next Level Search Form Using jQuery & CSS3">
+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
-
<meta name="author" content="Webstuffshare">
+
<!--person CSS -->
-
<link rel="stylesheet" href="http://1.oucigem.sinaapp.com/ouc-footer-demo.css?v=2">
+
<link rel="stylesheet" href="http://1.oucigem.sinaapp.com/ouc-igem-person.css">
-
</head>
+
<!-- jQuery for Hover Box -->
-
<body>
+
<script>
 +
$(document).ready(function(){
 +
$("img.static").hover(
 +
function() {
 +
$(this).stop().animate({"opacity": "0"}, "350");
 +
},
 +
function() {
 +
$(this).stop().animate({"opacity": "1"}, "350");
 +
});
 +
});
 +
</script>
 +
 +
<!-- CSS -->
 +
<style>
 +
/************** Code for Demo **************/
-
<h1>Creating "Next Level" Search Form Using jQuery & CSS3</h1>
+
/* Containing Element */
-
<br/>
+
#blur {
-
<div id="example">
+
  position:relative;
-
<h1>Simpe Style</h1>
+
  margin-left: 60px;
-
<div class="arrow2">hit the button <img src="images/arrow-right.png" /></div>
+
}
-
<div class="wrapper-simple">
+
-
<input type="text" placeholder="Type and enter..." />
+
/* Static Image Shown Before Hover */
-
<input type="submit" value="" />
+
#blur img.static {
-
<img src="images/search-icon-big.png" />
+
  position:absolute;
-
</div>
+
  left:0;
-
</div>
+
  top:0;
 +
  z-index:1;
 +
}
 +
 +
/* Image Shown Upon Hover */
 +
#blur img.blur {
 +
  position:absolute;
 +
  left:0;
 +
  top:0;
 +
}
 +
#ouc-footer{
 +
text-align:center;
 +
margin-top:-25px;
 +
-
<h1><span class="alert">Both following demo works only on Safari & Firefox. Tested only on Safari 5+ & Firefox 11.0 (both Mac)</span></h1>
+
}
 +
#footer-box{
 +
height: 50px;
 +
 +
width:1349px;
 +
margin-top:10px;
 +
margin-bottom:-10px;
 +
background-color:#1487DF;
 +
border:none;
 +
padding-left:0;
 +
padding-right:0;
 +
}
 +
#top-section{
 +
width:99%;
 +
}
 +
#footer a
 +
{
 +
color:#ffffff;
-
<div id="example1">
+
}
-
<h1>Cube Style </h1>
+
             
-
<div class="wrapper1">
+
                #ouc-tools ul li{
-
<div class="content-wrapper1">
+
                    display: inline-block;
-
<div class="search-button1">
+
                    margin-right: 20px;
-
<span><img src="https://static.igem.org/mediawiki/2012/e/ed/Ouc-footer-search-icon.png" /></span>
+
                    vertical-align: middle;
-
</div>
+
-
<div class="search-box1">
+
-
<input type="text" placeholder="Type your keyword..." />
+
                }
-
<img src="https://static.igem.org/mediawiki/2012/d/db/Ouc-footer-close.png" />
+
                input.searchButton {
-
</div>
+
           
-
</div>
+
                    font-size: 100%;
 +
                    background: none;
 +
                    border: none;
 +
                    color: #45b8ef;
 +
                    font-weight: bold;
 +
 +
margin-right:10px;
 +
margin-bottom:0;
 +
magin-left:10px;
 +
                }
 +
                input.searchButton:hover {
 +
                    color: #2d7ca3;
 +
 +
                }
 +
</style>
 +
</style>
 +
</head>
 +
<body>
 +
<div id="menu-wrapper">
 +
<div id="logo">
</div>
</div>
-
</div>
+
<ul class="menu">
-
 
+
<li> <a href="https://2012.igem.org/Team:OUC-China">Index</a> </li>
-
<div id="example2">
+
<li> <a href="https://2012.igem.org/Team:OUC-China/Project/Overview">Project</a> </li>
-
<h1>Cube Style With Animate</h1>  
+
<li> <a href="https://2012.igem.org/Team:OUC-China/Modeling/Overview">Modeling</a> </li>
-
<div class="wrapper2">
+
<li> <a href="https://2012.igem.org/Team:OUC-China/HumanPractice/Overview">Human Practice</a> </li>
-
<div class="content-wrapper2">
+
<li> <a href="https://2012.igem.org/Team:OUC-China/Team/members">Team</a> </li>
-
<div class="search-button2">
+
<li> <a href="https://2012.igem.org/Team:OUC-China/Parts">Parts</a> </li>
-
<span><img src="https://static.igem.org/mediawiki/2012/e/ed/Ouc-footer-search-icon.png"" /></span>
+
<li> <a href="https://2012.igem.org/Team:OUC-China/Safety">Safety</a> </li>
-
</div>
+
<li> <a href="https://2012.igem.org/Team:OUC-China/labnote">Note</a> </li>
-
<div class="search-box2">
+
</ul>
-
<input type="text" placeholder="Type your keyword..." />
+
-
<img src="https://static.igem.org/mediawiki/2012/d/db/Ouc-footer-close.png"" />
+
-
</div>
+
-
</div>
+
</div>
</div>
-
<div class="arrow"><img src="images/arrow.png" /> make a click</div>
+
<div id="submenu-wrapper">
 +
<ul class="submenu">
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China">
 +
<img src="https://static.igem.org/mediawiki/2012/a/af/Projectoverview.jpg" />
 +
Home
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China#hmo">
 +
<img src="https://static.igem.org/mediawiki/2012/4/49/Humanpracticeoverview.jpg" />
 +
HumanPractice index
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Judgingform">
 +
<img src="https://static.igem.org/mediawiki/2012/6/6e/Juding-form.jpg" />
 +
JudgingForm
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/contactus">
 +
<img src="https://static.igem.org/mediawiki/2012/1/1e/Contact-us.jpg" />
 +
Contact Us
 +
</a>
 +
 +
</li>
 +
</ul>
 +
<ul class="submenu">
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Project/Overview">
 +
<img src="https://static.igem.org/mediawiki/2012/5/59/Ouc-nav-project-overview.jpg" />
 +
Project Overview
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Project/Sensor/AbstractandBackground">
 +
<img src="https://static.igem.org/mediawiki/2012/1/15/Ouc-nav-project-secsor.jpg" />
 +
Sensor
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Project/DesignMaking/Abstract">
 +
<img src="https://static.igem.org/mediawiki/2012/3/34/Ouc-nav-device.jpg" />
 +
Decision-making Device
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Project/GVP/GasandBackground">
 +
<img src="https://static.igem.org/mediawiki/2012/5/57/Ouc-nav-project-gvp.jpg" />
 +
Gas vesicle
 +
</a>
 +
</li>
 +
</ul>
 +
<ul class="submenu">
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Modeling/ODEModel">
 +
<img src="https://static.igem.org/mediawiki/2012/f/f6/Ouc-nav-modeling-ode.jpg" />
 +
ODEModel
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Modeling/ParameterSensitivityAnalysis">
 +
<img src="https://static.igem.org/mediawiki/2012/c/cf/Ouc-nav-modeling-sensertitive.jpg" />
 +
Parameter Sensitivity Analysis
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Modeling/ParameterSweep">
 +
<img src="https://static.igem.org/mediawiki/2012/0/07/Ouc-nav-modeling-sweep.jpg" />
 +
Parameter Sweep
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Modeling/NoiseAnalysis">
 +
<img src="https://static.igem.org/mediawiki/2012/0/04/Ouc-nav-modeling-noise.jpg" />
 +
Noise Analysis
 +
</a>
 +
</li>
 +
</ul>
 +
<ul class="submenu">
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/HumanPractice/Overview">
 +
<img src="https://static.igem.org/mediawiki/2012/6/61/Ouc-nav-humanoverview.jpg" />
 +
HumanPractice Overview
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/HumanPractice/Communication">
 +
<img src="https://static.igem.org/mediawiki/2012/c/cc/Ouc-nav-Communication.jpg" />
 +
Meeting and Academic Communication
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/HumanPractice/Camps">
 +
<img src="https://static.igem.org/mediawiki/2012/8/8d/Ouc-nav-humcamp.jpg" />
 +
Camps, Class and Lectures
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/HumanPractice/SpecialHM">
 +
<img src="https://static.igem.org/mediawiki/2012/b/b7/Ouc-nav-hmspcial.jpg" />
 +
Special HP
 +
</a>
 +
</li>
 +
</ul>
 +
<ul class="submenu">
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Team/members">
 +
<img src="https://static.igem.org/mediawiki/2012/6/6d/Ouc-nav-team.jpg" />
 +
Team Members
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Team/instructor">
 +
<img src="https://static.igem.org/mediawiki/2012/3/35/Ouc-nav-instructor.jpg" />
 +
Instructors
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Team/AcknowledgementandCooperation">
 +
<img src="https://static.igem.org/mediawiki/2012/a/a6/Ouc-nav-co.jpg" />
 +
Acknowledgement&Cooperation
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Team/Lab">
 +
<img src="https://static.igem.org/mediawiki/2012/a/a7/Ouc-nav-lab.jpg" />
 +
Lab
 +
</a>
 +
</li>
 +
</ul>
 +
<ul class="submenu">
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Parts">
 +
<img src="https://static.igem.org/mediawiki/2012/f/f9/Ouc-nav-parts.jpg" />
 +
Parts
 +
</a>
 +
</li>
 +
</ul>
 +
<ul class="submenu">
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/Safety">
 +
<img src="https://static.igem.org/mediawiki/2012/5/5d/Ouc-nav-safety.jpg" />
 +
Safety
 +
</a>
 +
</li>
 +
</ul>
 +
<ul class="submenu">
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/labnote">
 +
<img src="https://static.igem.org/mediawiki/2012/8/8b/Ouc-nav-labnote.jpg" />
 +
Labnote
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://skydrive.live.com/redir?resid=6A13E80E2A176A23!249&authkey=!AGsNOi9excznIt8">
 +
<img src="https://static.igem.org/mediawiki/2012/4/4e/Ouc-nav-modelingnote.jpg" />
 +
Modeling Note
 +
</a>
 +
</li>
 +
<li>
 +
<a href="https://2012.igem.org/Team:OUC-China/protocol">
 +
<img src="https://static.igem.org/mediawiki/2012/7/7d/Ouc-pro.png" />
 +
Protocols
 +
</a>
 +
</li>
 +
</ul>
 +
</div>
 +
<section id="wrapper">
 +
<article id="main">
 +
<h2>BaoYingying</h2>
 +
<p>Wiki programmer</p>
 +
 +
<!-- Code for jQuery Hover Box -->
 +
<div id="blur">
 +
<a>
 +
<img src="https://static.igem.org/mediawiki/2012/8/8b/Ouc-person-baoyingying1.jpg" class="static">
 +
</a>
 +
<img src="https://static.igem.org/mediawiki/2012/b/b0/Ouc-person-baoyingying2.jpg" class="blur">
 +
<div id="person-intro">
 +
<p>Hi, I am Bao Yingying, a junior student in college of information science and engineering. My major is computer science and technology.  It is a challenge and great honor to me to be the design assistant in OUC-China team. I have the passion for web development, meanwhile, I am now learning. Although it is not my major, I like molecular biology. I hope I can make my team's overview better. Making a great show about our project is the goal of all members. </p>
</div>
</div>
-
 
+
</div>
-
+
<!-- Code for jQuery Hover Box -->
-
<script>!window.jQuery && document.write(unescape('%3Cscript src="http://1.oucigem.sinaapp.com/ouc-footer-jquery-1.7.1.min.js"%3E%3C/script%3E'))</script>
+
-
<script type="text/javascript" src="http://1.oucigem.sinaapp.com/ouc-footer-modernizr.js"></script>
+
-
<script type="text/javascript" src="http://1.oucigem.sinaapp.com/ouc-footer-demo.js"></script>
+
</article>
-
+
</section>
-
<!-- GA -->
+
</body>
 +
<script type="text/javascript" src="http://1.oucigem.sinaapp.com/OUC-nav.js"></script><!--nav js-->
 +
<!-- GA -->
<script type="text/javascript">
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
Line 68: Line 310:
var pageTracker = _gat._getTracker("UA-2260508-2");
var pageTracker = _gat._getTracker("UA-2260508-2");
pageTracker._trackPageview();
pageTracker._trackPageview();
-
} catch(err) {}</script>
+
} catch(err) {}
-
<!-- GA -->
+
</script>
-
</body>
+
 
-
</html>
+
 
 +
 
 +
    <div id="ouc-footer">
 +
        <div id="ouc-tools">
 +
         
 +
            <ul>
 +
                <li id="ouc-clustrmaps-wrapper">
 +
                    <div id="clustrmaps-widget"></div><script type="text/javascript">var _clustrmaps = {'url' : 'https://2012.igem.org/Team:OUC-China', 'user' : 1034709, 'server' : '4', 'id' : 'clustrmaps-widget', 'version' : 1, 'date' : '2012-09-22', 'lang' : 'zh', 'corners' : 'square' };(function (){ var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = 'http://www4.clustrmaps.com/counter/map.js'; var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);})();</script><noscript><a href="http://www4.clustrmaps.com/user/c56fc9d5"><img src="http://www4.clustrmaps.com/stats/maps-no_clusters/2012.igem.org-Team-OUC-China-thumb.jpg" alt="Locations of visitors to this page" /></a></noscript>
 +
                </li>
 +
                <li>
 +
<a href="http://www.renren.com/296396903/profile?ref=opensearch_normal"><img src="https://static.igem.org/mediawiki/2012/d/d2/Ouc-footer-cmlsast.jpg" alt="OUC CMLS AST" border="0"></a> 
 +
                </li>
 +
                <li>
 +
                    <a href="https://2012.igem.org/Team:OUC-China/contactus"><img src="https://static.igem.org/mediawiki/2012/5/5e/OUC-footer-contact.jpg" alt="Contact Us" border="0"></a>
 +
                </li>
 +
                <li style="width:160px;">
 +
<form action="/Special:Search" id="searchform" style=" border-color:#000;">
 +
<input id="searchInput" name="search" type="text" title="Search 2011.igem.org [f]" accesskey="f" value="">
 +
<input type='submit' name="go" class="searchButton" id="searchGoButton" value="Go" title="Go to a page with this exact name if exists" />&nbsp;
 +
<input type='submit' name="fulltext" class="searchButton" id="mw-searchButton" value="Search" title="Search the pages for this text" />
 +
</form>
 +
                </li>
 +
            </ul>
 +
        </div>
 +
     
 +
    </div></html>

Latest revision as of 02:33, 25 October 2012

BaoYingying

Wiki programmer

Hi, I am Bao Yingying, a junior student in college of information science and engineering. My major is computer science and technology. It is a challenge and great honor to me to be the design assistant in OUC-China team. I have the passion for web development, meanwhile, I am now learning. Although it is not my major, I like molecular biology. I hope I can make my team's overview better. Making a great show about our project is the goal of all members.