Difference between revisions of "Team:Dalhousie/test4"

Line 1: Line 1:
 
<html>
 
<html>
 
<head>
 
<head>
 +
 +
 +
 +
 
<!--glyphicons-->
 
<!--glyphicons-->
 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
Line 31: Line 35:
 
   </style>
 
   </style>
  
−
<!------------fade-------------------------->
+
<!------------fadedivs-------------------------->
 
<style>
 
<style>
 
#grad1 {
 
#grad1 {
Line 44: Line 48:
 
<style>
 
<style>
 
#grad2 {
 
#grad2 {
 +
position: absolute;
 +
z-index:1;
 
height: 100%;
 
height: 100%;
 
width:100%;
 
width:100%;
Line 55: Line 61:
  
  
 +
 +
<!----------------------------------------------OLDnavbarHEADshit---------------------------------------------->
 +
 +
 +
  <meta charset="utf-8">
 +
  <meta name="viewport" content="width=device-width, initial-scale=1">
 +
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 +
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 +
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 +
 +
 +
 +
 +
 +
 +
</head>
 
   
 
   
 
<body>
 
<body>
Line 64: Line 86:
  
 
     <div id="grad1"><!--------fade------------>
 
     <div id="grad1"><!--------fade------------>
−
<video  id= "myVideo" class="bg-video" style="top:0px; left:0px; padding-bottom:0px; position:fixed; width:100%;z-index:-1;" autoplay="true" loop="loop" preload="metadata" muted="muted">
+
<video  id= "myVideo" class="bg-video" style="top:0px; left:0px; padding-bottom:0px; position:fixed; width:100%;z-index:-100;" autoplay="true" loop="loop" preload="metadata" muted="muted">
−
         <source src="https://static.igem.org/mediawiki/2017/d/d0/Final4.mp3" type="video/mp4" />
+
         <source src="https://static.igem.org/mediawiki/2017/5/53/Final5.mp4" type="video/mp4" />
 
     </video>
 
     </video>
  
Line 116: Line 138:
  
 
  </div>
 
  </div>
 +
 +
 +
 
</div>
 
</div>
  
−
                     
 
  
  
  
−
<div class="container" id="projectdescript" style="padding-bottom:50px; padding-top:50px; padding-right:100px; padding-left:150px; width:100%;  height:1700px; background-color: black;">
 
  
  
−
<!-----------------------------------------------------------NAV------------------------------------------------->
+
<div class="container" id="projectdescript" style="padding-bottom:50px; padding-top:50px; padding-right:100px; padding-left:150px; width:100%;  height:1700px; background-color: blue; ">
 +
 
 +
 
 +
<!-------------------------------------------------------------NAVBAR----------------------------------------------------------------------------->
  
 
<style>
 
<style>
−
@import url(https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css);
+
body {
 +
    height:1600px;
 +
    margin:0;
 +
}
 +
#navWrap {
 +
position: absolute;
 +
    height:70px
 +
  z-index:100;
 +
  left:0px;
 +
width:100%;
  
−
/* To mantain the navbar at the bottom*/
+
}
−
header {
+
nav {
−
  width: 100%;
+
    height: 70px;
−
  min-height:calc(100vh - 52px);
+
    background:red;
 +
z-index:100;
 +
width:100%;
 +
}
 +
.sticky {
 +
    position: fixed;
 +
    bottom:0;
 +
width:100%;
 +
z-index:100;
 +
}
 +
h1 {
 +
    margin: 0;
 +
color: white;
 
}
 
}
  
  
−
/* To mantain the navbar at the top once it is affixed */
 
−
.affix {
 
−
    top: 0;
 
−
    width: 100%;
 
−
  }
 
−
 
−
/* Padding for a smoth affix */
 
−
.affix + .container-fluid {
 
−
  padding-top: 72px;
 
−
}
 
 
</style>
 
</style>
 +
 
<script>
 
<script>
−
$(function(){
+
 
−
    $('.navbar').affix({
+
 
−
      offset: {
+
 
−
         /* Affix the navbar after scroll below header */
+
$(window).scroll(function(){
−
        top: $("header").outerHeight(true)}
+
var position = $(window).scrollTop();
−
     });
+
  if (position>335)
−
});
+
      $('nav').addClass('sticky');
 +
    else {
 +
         $('nav').removeClass('sticky');
 +
     }
 +
})
 +
 
 +
 
 +
 
 
</script>
 
</script>
  
−
<header class='container-fluid'>
+
  <!------------------NEW NAVBAR--------------------------------->
−
  <h1>Title</h1>
+
<div id="navWrap">
−
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac neque et sem molestie scelerisque.<br/>In felis sem, pharetra ornare mi et, mattis rhoncus est.<br/>Fusce id nulla et enim molestie fermentum sed ullamcorper nibh. </p>
+
    <nav>
−
</header>
+
  
−
<nav class='navbar navbar-default'>
 
−
  <div class='container'>
 
−
    <div class='navbar-header'>
 
−
      <button type='button' class='navbar-toggle' data-toggle='collapse' data-target='.navbar-collapse'>
 
−
        <span class='sr-only'>Toggle Navigation</span>
 
−
        <span class='icon-bar'></span>
 
−
        <span class='icon-bar'></span>
 
−
        <span class='icon-bar'></span>
 
−
      </button>
 
−
      <a href='#' class='navbar-brand'> Title</a>
 
−
    </div>
 
  
−
    <div class='collapse navbar-collapse'>
+
 
−
      <ul class='nav navbar-nav navbar-right'>
+
 
−
         <li><a href=''>Link</a></li>
+
          <!------------------------------------------------------------------------------- OLDNavbar -------------------------------------------------------------------------->
−
         <li><a href=''>Link</a></li>
+
<nav class="navbar navbar-inverse navbar-fixed-bottom">
−
         <li><a href=''>Link</a></li>
+
  <div class="container-fluid">
−
         <li><a href=''>Link</a></li>
+
   
−
       </ul>
+
    <ul class="nav navbar-nav navbar-center">
 +
      <li class="active"><a href="https://2017.igem.org/Team:Dalhousie/test3">Home</a></li>
 +
     
 +
 
 +
<li class="dropdown">
 +
         <a class="dropdown-toggle" data-toggle="dropdown" href="#">The Project
 +
        <span class="caret"></span></a>
 +
        <ul class="dropdown-menu">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Description">Description</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Design">Design</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Experiments">Experiments</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Notebook">Notebook</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Interlab">Interlab</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Contribution">Contribution</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Model">Model</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Results">Results</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Demonstrate">Demonstrate</a></li>
 +
        <li><a href="https://2017.igem.org/Team:Dalhousie/Improve">Improve</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Attributions">Attributions</a></li>
 +
         </ul>
 +
      </li>
 +
 
 +
     
 +
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Our Team
 +
        <span class="caret"></span></a>
 +
        <ul class="dropdown-menu">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Team">Team</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Collaborations">Collaborations</a></li>
 +
         </ul>
 +
      </li>
 +
 
 +
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Parts
 +
        <span class="caret"></span></a>
 +
        <ul class="dropdown-menu">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Parts">Parts</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Basic_Parts">Basic Parts</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Composite_Parts">Composite Parts</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/Part_Collection">Part Collections</a></li>
 +
         </ul>
 +
      </li>
 +
 
 +
      <li><a href="https://2017.igem.org/Team:Dalhousie/Safety">Safety</a></li>
 +
 
 +
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Human Practices
 +
        <span class="caret"></span></a>
 +
        <ul class="dropdown-menu">
 +
        <li><a href="https://2017.igem.org/Team:Dalhousie/Human_Practices">Summary</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Silver_Integrated">Silver HP</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Gold_Integrated">Integrated and Gold</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Public_Engagement">Public Engagement</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Part_Collection">Part Collections</a></li>
 +
        </ul>
 +
       </li>
 +
 
 +
<li class="dropdown">
 +
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Awards
 +
        <span class="caret"></span></a>
 +
        <ul class="dropdown-menu">
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Applied_Design">Applied Design</a></li>
 +
          <li><a href="https://2017.igem.org/Team:Dalhousie/HP/Entrepreneurship">Entrepreneurship</a></li>
 +
        </ul>
 +
      </li>
 +
 
 +
 
 +
    </ul>
 +
 
 +
 
 +
 
 +
<!--------------------------contact us------------------------------------------>
 +
<ul class="nav navbar-nav navbar-right">
 +
    <div class="navbar-header">
 +
      <a class="navbar-brand" >Contact us today </a>
 
     </div>
 
     </div>
 +
<li>
 +
                        <a href="mailto:igemdalhousie@gmail.com" ><i class="fa fa-envelope-o fa-fw"></i> <span class="network-name"></span></a>
 +
                    </li>
 +
<li>
 +
                        <a target="_blank" href="https://twitter.com/dalhousie_igem?lang=en" ><i class="fa fa-twitter fa-fw"></i> <span class="network-name"></span></a>
 +
                    </li>
 +
                    <li>
 +
                        <a target="_blank" href="https://www.facebook.com/Dalhousie.iGEM/" ><i class="fa fa-facebook fa-fw"></i> <span class="network-name"></span></a>
 +
                    </li>
 +
    </ul>
 
   </div>
 
   </div>
 
</nav>
 
</nav>
 +
    <!------------------------------------------------------------------------------- OLDNavbarEND -------------------------------------------------------------------------->
  
−
<div class='container-fluid'>
+
    </nav>
−
  <h1>Title</h1>
+
−
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac neque et sem molestie scelerisque.<br/>In felis sem, pharetra ornare mi et, mattis rhoncus est.<br/>Fusce id nulla et enim molestie fermentum sed ullamcorper nibh. </p>
+
−
  <h1>Title</h1>
+
−
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac neque et sem molestie scelerisque.<br/>In felis sem, pharetra ornare mi et, mattis rhoncus est.<br/>Fusce id nulla et enim molestie fermentum sed ullamcorper nibh. </p>
+
−
  <h1>Title</h1>
+
−
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac neque et sem molestie scelerisque.<br/>In felis sem, pharetra ornare mi et, mattis rhoncus est.<br/>Fusce id nulla et enim molestie fermentum sed ullamcorper nibh. </p>
+
−
  <h1>Title</h1>
+
−
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac neque et sem molestie scelerisque.<br/>In felis sem, pharetra ornare mi et, mattis rhoncus est.<br/>Fusce id nulla et enim molestie fermentum sed ullamcorper nibh. </p>
+
 
</div>
 
</div>
  
−
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
 
−
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
 
  
 +
<!-------------------------------------------------------------NAVBAR END----------------------------------------------------------------------------->
  
−
<!-----------------------------------------------------------NAVEND------------------------------------------------->
 
  
−
<!---------------------------------------------------------------------------------infographic------------------------------------------------------------------->
+
<!-------------------------------------------infographic----------------------------->
 
<p style="text-align:center; color:white;">
 
<p style="text-align:center; color:white;">
 
<img src= "https://static.igem.org/mediawiki/2017/8/8b/Infograph2_1.jpg" align="center" height="85%" width="85%"></p>
 
<img src= "https://static.igem.org/mediawiki/2017/8/8b/Infograph2_1.jpg" align="center" height="85%" width="85%"></p>
 +
 +
 +
 
  </div>
 
  </div>
  
Line 221: Line 332:
  
  
−
<div class="container"  style="padding-bottom:50px; padding-top:50px; padding-right:100px; padding-left:100px;  width:100%; height:100%; background-color: #FCEBD9;">
+
<div class="container"  style="padding-bottom:100px; padding-top:50px; padding-right:100px; padding-left:100px;  width:100%; height:100%; background-color: #FCEBD9;">
 
<p style="text-align:center; color:black; font-size: 50px;">
 
<p style="text-align:center; color:black; font-size: 50px;">
 
  Sponsor area</p>
 
  Sponsor area</p>
Line 229: Line 340:
 
                
 
                
  
−
</body></html>
+
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
</body>
 +
</html>

Revision as of 19:53, 12 September 2017

Welcome to Dalhousie's 2017 iGEM wiki

Sponsor area