Team:Rutgers/Safety
From 2013.igem.org
Line 1: | Line 1: | ||
- | + | <html lang="en" class="no-js"> | |
- | <html> | + | <head> |
- | + | <meta charset="UTF-8" /> | |
- | + | <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
- | < | + | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
- | <table width="50%" border="0" align="center" cellpadding="0" cellspacing="20" bordercolor="#F1F1F1" background="https://static.igem.org/mediawiki/2012/2/25/Chevbg1.png" > | + | <title>Rutgers Safety (important!)</title> |
+ | <meta name="description" content="Rutgers iGEM 2013 safety" /> | ||
+ | <link rel="shortcut icon" href="https://static.igem.org/mediawiki/igem.org/2/2c/Hamey.gif"> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:Rutgers/css/default?action=raw&ctype=text/css" /> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:Rutgers/css/component.timeline?action=raw&ctype=text/css" /> | ||
+ | <link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:Rutgers/css/component.menu?action=raw&ctype=text/css" /> | ||
+ | <script src="https://2013.igem.org/Team:Rutgers/js/modernizr.custom?action=raw&ctype=javascript"></script> | ||
+ | </head> | ||
+ | <body> | ||
+ | <div class="container"> | ||
+ | <header class="clearfix"> | ||
+ | <a href="https://2013.igem.org/Team:Rutgers/index"><img src="https://static.igem.org/mediawiki/2013/6/6b/Knight.png"></a> | ||
+ | <nav id="menu" class="nav"> | ||
+ | <ul> | ||
+ | <li> | ||
+ | <a href="https://2013.igem.org/Team:Rutgers/Project"> | ||
+ | <span class="icon"> | ||
+ | <i aria-hidden="true" class="icon-project"></i> | ||
+ | </span> | ||
+ | <span>project</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2013.igem.org/Team:Rutgers/People"> | ||
+ | <span class="icon"> | ||
+ | <i aria-hidden="true" class="icon-team"></i> | ||
+ | </span> | ||
+ | <span>people</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2013.igem.org/Team:Rutgers/Modelling"> | ||
+ | <span class="icon"> | ||
+ | <i aria-hidden="true" class="icon-modelling"></i> | ||
+ | </span> | ||
+ | <span>modelling</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2013.igem.org/Team:Rutgers/Safety" class="active"> | ||
+ | <span class="icon"> | ||
+ | <i aria-hidden="true" class="icon-sponsors"></i> | ||
+ | </span> | ||
+ | <span>safety</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2013.igem.org/Team:Rutgers/Notebook"> | ||
+ | <span class="icon"> | ||
+ | <i aria-hidden="true" class="icon-notebook"></i> | ||
+ | </span> | ||
+ | <span>notebook</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | <li> | ||
+ | <a href="https://2013.igem.org/Team:Rutgers/Practices"> | ||
+ | <span class="icon"> | ||
+ | <i aria-hidden="true" class="icon-outreach"></i> | ||
+ | </span> | ||
+ | <span>practices</span> | ||
+ | </a> | ||
+ | </li> | ||
+ | </ul> | ||
+ | </nav> | ||
+ | </header> | ||
+ | <div class="main"> | ||
+ | <table width="50%" border="0" align="center" cellpadding="0" cellspacing="20" bordercolor="#F1F1F1" background="https://static.igem.org/mediawiki/2012/2/25/Chevbg1.png" > | ||
Line 247: | Line 313: | ||
<tr> | <tr> | ||
<td width="69%" class="imgshadow2"><blockquote> </blockquote></tr><td colspan="2" td background="chevpg.png"> </td> | <td width="69%" class="imgshadow2"><blockquote> </blockquote></tr><td colspan="2" td background="chevpg.png"> </td> | ||
- | </body> | + | </div> |
+ | </div> | ||
+ | <script> | ||
+ | // The function to change the class | ||
+ | var changeClass = function (r,className1,className2) { | ||
+ | var regex = new RegExp("(?:^|\\s+)" + className1 + "(?:\\s+|$)"); | ||
+ | if( regex.test(r.className) ) { | ||
+ | r.className = r.className.replace(regex,' '+className2+' '); | ||
+ | } | ||
+ | else{ | ||
+ | r.className = r.className.replace(new RegExp("(?:^|\\s+)" + className2 + "(?:\\s+|$)"),' '+className1+' '); | ||
+ | } | ||
+ | return r.className; | ||
+ | }; | ||
+ | |||
+ | // Creating our button in JS for smaller screens | ||
+ | var menuElements = document.getElementById('menu'); | ||
+ | menuElements.insertAdjacentHTML('afterBegin','<button type="button" id="menutoggle" class="navtoogle" aria-hidden="true" style="color:white"><i aria-hidden="true" class="icon-menu"> </i> Menu</button>'); | ||
+ | |||
+ | // Toggle the class on click to show / hide the menu | ||
+ | document.getElementById('menutoggle').onclick = function() { | ||
+ | changeClass(this, 'navtoogle active', 'navtoogle'); | ||
+ | } | ||
+ | |||
+ | // http://tympanus.net/codrops/2013/05/08/responsive-retina-ready-menu/comment-page-2/#comment-438918 | ||
+ | document.onclick = function(e) { | ||
+ | var mobileButton = document.getElementById('menutoggle'), | ||
+ | buttonStyle = mobileButton.currentStyle ? mobileButton.currentStyle.display : getComputedStyle(mobileButton, null).display; | ||
+ | |||
+ | if(buttonStyle === 'block' && e.target !== mobileButton && new RegExp(' ' + 'active' + ' ').test(' ' + mobileButton.className + ' ')) { | ||
+ | changeClass(mobileButton, 'navtoogle active', 'navtoogle'); | ||
+ | } | ||
+ | } | ||
+ | </script> | ||
+ | </body> | ||
</html> | </html> |
Revision as of 02:39, 28 September 2013
| ||
| ||
| ||
| ||
| ||
| ||
|