Team:RAMNOTIREN CALGARY/Notebook

From 2014hs.igem.org

(Difference between revisions)
(Blanked the page)
Line 1: Line 1:
 +
<html>
 +
<head>
 +
<link rel='stylesheet' type='text/css' href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/Stylesheets/indexcss.css?action=raw&ctype=text/css"/>
 +
 +
<style>
 +
h1{
 +
font-size: 2.5em;
 +
}
 +
h2{
 +
font-size: 25.5px;
 +
}
 +
 +
p {
 +
text-indent:50px;
 +
}
 +
 +
#box1{
 +
width: 968px;
 +
margin-top: -10px;
 +
background: #E6E6E6; /*threedface*/
 +
float: left;
 +
padding-bottom: 20px;
 +
margin-bottom: 13px;
 +
}
 +
 +
#box1 h2{
 +
padding: 0px 0px 0px 0px;
 +
text-align: center;
 +
font-family: arial, verdana, "lucida sans";
 +
}
 +
 +
#box1 p{
 +
padding: 0px 50px 0px 350px;
 +
font-family: arial, verdana, "lucida sans";
 +
font-size: 15px;
 +
}
 +
 +
#content {
 +
z-index: 1;
 +
background-color: transparent;
 +
border: none;
 +
padding-bottom: 0;
 +
margin: 0;
 +
width: 100%;
 +
overflow: hidden;
 +
margin-top: -45px !important;
 +
height:auto !important; /* real browsers */
 +
height:100%; /* IE6: treaded as min-height*/
 +
min-height:100%; /* real browsers */
 +
}
 +
 +
#top-section {
 +
z-index: 2;
 +
height: 15px;
 +
margin: 0px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
margin-bottom: 0 !important;
 +
padding:0;
 +
border: none;
 +
font-size: 10px;
 +
}
 +
 +
#p-logo {
 +
height:1px;
 +
overflow:hidden;
 +
display: none;
 +
}
 +
 +
#search-controls {
 +
overflow:hidden;
 +
display:block;
 +
background: none;
 +
position: absolute;
 +
top: 100px;
 +
right: 40px;
 +
}
 +
 +
.left-menu {
 +
width: 500px !important;
 +
display:block;
 +
margin-top:-80px;
 +
border: none;
 +
text-align: right;
 +
}
 +
 +
.left-menu ul {
 +
border: none;
 +
}
 +
 +
#menubar.right-menu {
 +
width:300px;
 +
display:block;
 +
float:left;
 +
margin-top:-80px;
 +
border: none;
 +
}
 +
 +
.right-menu ul {
 +
border: none;
 +
width: 300px;
 +
}
 +
 +
#footer-box {
 +
background-color: #216085;
 +
border: none;
 +
width: 850px;
 +
height: 30px;
 +
margin: -10px auto 0 auto;
 +
padding: 20px 0;
 +
}
 +
 +
#footer {
 +
border: none;
 +
width: 850px;
 +
margin: 0 auto;
 +
padding: 0;
 +
}
 +
 +
.firstHeading {
 +
display: block;
 +
}
 +
 +
#f-list a {
 +
color: #333;
 +
font-size: 10px;
 +
}
 +
 +
#f-list a:hover {
 +
color: #666;
 +
}
 +
 +
.printfooter {
 +
display: none;
 +
}
 +
 +
#footer ul {
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 +
#footer ul li {
 +
margin-top: 0;
 +
margin-bottom: 0;
 +
margin-left: 10px;
 +
margin-right: 10px;
 +
padding: 0;
 +
}
 +
 +
#search-controls {
 +
display:none;
 +
}
 +
 +
h3#siteSub {
 +
display: none;
 +
}
 +
 +
#contentSub {
 +
display: none;
 +
}
 +
 +
p:first-child {
 +
display: block;
 +
}
 +
 +
h1{
 +
border:none;
 +
width: 100%;
 +
clear: both;
 +
}
 +
 +
.progress{
 +
display: none;
 +
}
 +
 +
</style>
 +
 +
<script type="text/javascript" src ="https://2014hs.igem.org/common/jquery-latest.min.js"></script>
 +
 +
<script type="text/javascript">
 +
    function slider() {
 +
        var $current = $('#slides IMG.current');
 +
 +
        if ( $current.length == 0 ) $current = $('#slides IMG:last');
 +
        var $next =  $current.next().length ? $current.next()
 +
            : $('#slides IMG:first');
 +
 +
          $current.addClass('previous');
 +
        $next.css({opacity: 0.0})
 +
            .addClass('current')
 +
            .animate({opacity: 1.0}, 2500, function() {
 +
                $current.removeClass('current previous');
 +
    });
 +
 +
    var $navicurrent = $('.progress li.current');
 +
    if($navicurrent.length ==0) $navicurrent = $('.progress li:last');
 +
    var $navinext = $navicurrent.next().length ? $navicurrent.next() : $('.progress li:first');
 +
    $navicurrent.addClass('previous');
 +
    $navicurrent.removeClass('current previous');
 +
    $navinext.addClass('current').animate({opacity: 1.0}, 2500, function() {
 +
            });
 +
 +
    $('.progress li').click(function(){
 +
       
 +
        var $ncurrent = $(this);
 +
            $('.progress li').removeClass('current').removeClass('previous');
 +
            $('#slides IMG').removeClass('current').removeClass('previous');
 +
            $ncurrent.addClass('current');
 +
            var ncurrentindex = $ncurrent.index();
 +
        if(  ncurrentindex=== 0) $current = $('#slides IMG:first');
 +
            if(  ncurrentindex=== 1) $current = $('#slides IMG:eq(1)');
 +
            if(  ncurrentindex=== 2) $current = $('#slides IMG:eq(2)');
 +
            if(  ncurrentindex=== 3) $current = $('#slides IMG:last');
 +
            $current.addClass('current');
 +
 +
    });
 +
 +
    }
 +
 +
    $(function() {
 +
        setInterval( "slider()", 5000 );
 +
    });
 +
 +
    $(function() {
 +
 +
    var offset = $("#sidebar").offset();
 +
    var topPadding = 15;
 +
 +
    $(window).scroll(function() {
 +
   
 +
        if ($(window).scrollTop() > offset.top) {
 +
       
 +
            $("#sidebar").stop().animate({
 +
           
 +
                marginTop: $(window).scrollTop() - offset.top + topPadding
 +
           
 +
            });
 +
       
 +
        } else {
 +
       
 +
            $("#sidebar").stop().animate({
 +
           
 +
                marginTop: 0
 +
           
 +
            });
 +
       
 +
        }
 +
       
 +
           
 +
    });
 +
 +
});
 +
 +
/*back to top JS start */
 +
 +
    $(document).ready(function () {
 +
 +
    $(window).scroll(function () {
 +
        if ($(this).scrollTop() > 100) {
 +
            $('.scrollup').fadeIn();
 +
        } else {
 +
            $('.scrollup').fadeOut();
 +
        }
 +
    });
 +
 +
    $('.scrollup').click(function () {
 +
        $("html, body").animate({
 +
            scrollTop: 0
 +
        }, 600);
 +
        return false;
 +
    });
 +
 +
});
 +
 +
//back to top js script end
 +
 +
</script>
 +
 +
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
 +
 +
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>
 +
 +
 +
</head>
 +
<body>
 +
<div id="globalWrapper"/>
 +
 +
    <div id="main-content"/>
 +
 +
    <div id="topmenubar" class="topleft-menu"/>
 +
    <ul>
 +
    <li><a href="https://igem.org/Team_List?year=2014&division=high_school" style='color:#014457; cursor:pointer' target="blank">teams</a></li>
 +
    <li class='selected'><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY">Page</a></li>
 +
<li class='new'><a href="https://2014hs.igem.org/wiki/index.php?title=Talk:Team:RAMNOTIREN_CALGARY&action=edit&redlink=1">Discussion</a></li>
 +
    <li><a href="https://2014hs.igem.org/wiki/index.php?title=Team:RAMNOTIREN_CALGARY/Notebook&action=edit">View Source</a></li>
 +
    <li><a href="https://2014hs.igem.org/wiki/index.php?title=Team:RAMNOTIREN_CALGARY&action=history">History</a></li>
 +
    <li><a href="https://igem.org/Login">Log in</a></li>
 +
</ul>
 +
</div>
 +
 +
<header>
 +
<div id="slides">
 +
    <img  src="banner1.jpg" width="968" height="272" alt="" class="current" />
 +
    <img  src="tbanner2.jpg" width="968" height="272" alt="" />
 +
    <img  src="tbanner3.jpg" width="968" height="272" alt="" />
 +
    <img  src="tbanner4.jpg" width="968" height="272" alt="" />
 +
</div>
 +
<ul class="progress">
 +
    <li class="current"><a href="#n_0">1</a> </li>
 +
    <li><a href="#n_1">2</a> </li>
 +
    <li><a href="#n_2">3</a> </li>
 +
    <li><a href="#n_3">4</a> </li>
 +
</ul>
 +
 +
<div>
 +
<ul id="menu">
 +
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/‎" name="test" id="homelink">Home</a></li>
 +
 +
<li><a href="2014hs.igem.org/Team:RAMNOTIREN_CALGARY‎/Team" id="teamlink">Team</a>
 +
<ul>
 +
<li><a href="2014hs.igem.org/Team:RAMNOTIREN_CALGARY‎/Team">Members</a></li>
 +
<li><a href="https://igem.org/Team.cgi">Official Profile</a></li>
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/AboutCMHS">About CMHS</a></li>
 +
</ul>
 +
</li>
 +
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/Project" id="projectlink">Project </a>
 +
<ul>
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/Project/Content">Content</a></li>
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/HumanPractices">Human Practices</a></li>
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/References">References</a></li>
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/Attributions">Attributions</a></li>
 +
</ul>
 +
</li>
 +
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/Parts" id="partslink">Parts</a></li>
 +
 +
<li><a class="drop" href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/Notebook" id="notebooklink">Notebook</a></li>
 +
 +
<li><a href="https://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/Sponsors" id="sponsorslink">Sponsors</a></li>
 +
 +
<li><a href="https://2014hs.igem.org" target="_blank">iGEM</a></li>
 +
</ul>
 +
</div>
 +
</header>
 +
 +
 +
<div id="sidebar">
 +
    <div style="margin-left: 2em">
 +
        <div id="list">
 +
            <ul>
 +
                    <li> <a href="#JE1">jQuery (animated)</a></li>                    
 +
                <li> <a href="#JE2">CSS (fixed)</a></li>                    
 +
                <li> <a href="#JE3">CSS (reveal)</a></li>                    
 +
                <li> <a href="#JE4">TEST</a></li>                    
 +
                <li> <a href="#JE5">TEXT</a></li>                   
 +
            </ul>
 +
        </div>
 +
    </div>
 +
</div>
 +
 +
<div>
 +
   
 +
    <div id="notecontainer1">
 +
    <h1>Scrolling Sidebar</h1>
 +
    <p id="JE1">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
 +
    <p id="JE2">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
 +
    <p id="JE3">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
 +
    <p id="JE4">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
 +
    <p id="JE5">Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
 +
</div>
 +
</div>
 +
 +
<article>
 +
    <a href="http://www.google.com" target="test" class="scrollup">Scroll</a>
 +
</article>
 +
 +
</body>
 +
</html>

Revision as of 06:33, 20 May 2014

Scrolling Sidebar

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus

Retrieved from "http://2014hs.igem.org/Team:RAMNOTIREN_CALGARY/Notebook"