Difference between revisions of "Template:Groningen"

 
(216 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 +
 
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Raleway" />
 
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Raleway" />
 +
<link rel="shortcut icon" type="image/x-icon" href="https://static.igem.org/mediawiki/2017/2/23/Tab_ding_icon_32.png" />
  
 
<script>
 
<script>
Line 7: Line 9:
 
$(document).ready(function() {
 
$(document).ready(function() {
 
$("#HQ_page").attr('id','');
 
$("#HQ_page").attr('id','');
−
// call the functions that control the menu  
+
// call the functions that control the menu
 
menu_functionality();
 
menu_functionality();
 
hide_show_menu();
 
hide_show_menu();
Line 71: Line 73:
 
/* START GENERAL STYLES */
 
/* START GENERAL STYLES */
 
html {
 
html {
−
     height: 100%;
+
     //height: 100%;
 
     width: 100%;
 
     width: 100%;
 
     margin: 0;
 
     margin: 0;
Line 78: Line 80:
 
body {
 
body {
 
     width: auto !important;
 
     width: auto !important;
−
    height: 100%;
 
 
     width: 100%;
 
     width: 100%;
 
     margin: 0;
 
     margin: 0;
Line 84: Line 85:
 
     font-size: 10pt;
 
     font-size: 10pt;
 
     font-family: Raleway;
 
     font-family: Raleway;
 +
 +
    position: relative;
 +
    //height: auto;
 +
    //min-height: 100%;
 +
 
}
 
}
 
h1,h2,h3,h4,h5{
 
h1,h2,h3,h4,h5{
Line 145: Line 151:
 
     height:1000px;
 
     height:1000px;
 
     width: 1000px;
 
     width: 1000px;
−
     overflow: auto;  
+
     //overflow: auto;  
−
     overflow-y: hidden; // hide vertical
+
     //overflow-y: hidden; hide vertical
−
     overflow-x: hidden; // hide horizontal
+
     //overflow-x: hidden; hide horizontal
 
}
 
}
  
Line 168: Line 174:
 
}
 
}
 
.imglabh {
 
.imglabh {
−
     display: block;
+
     /*display: block;*/
−
     max-width: 70%;
+
     max-width: 100%;
 +
    overflow: visible;
 
     margin: auto;
 
     margin: auto;
 
     text-align: center;
 
     text-align: center;
Line 204: Line 211:
 
  text-decoration:none;
 
  text-decoration:none;
 
  text-align:center;
 
  text-align:center;
−
  cursor:pointer;white-space:nowrap
+
  cursor:pointer;
 +
white-space:nowrap;
 
}
 
}
  
Line 366: Line 374:
 
     vertical-align: middle;
 
     vertical-align: middle;
 
     text-align: center;
 
     text-align: center;
 +
    max-width:999px;
 
}
 
}
 
#container {  
 
#container {  
Line 480: Line 489:
 
     padding-right: 10px;
 
     padding-right: 10px;
 
          
 
          
 +
}
 +
 +
/* TABLEIZERS */
 +
table.tableizer-table {
 +
    color: #000;
 +
    //width: 640px;
 +
    border-collapse: collapse;
 +
    border-spacing: 0;
 +
    font-family:raleway;
 +
    max-width: 100%;
 +
}
 +
table.tableizer-table td, th {
 +
    border: 1px solid transparent; /* No more visible border */
 +
    padding: 6px 20px;
 +
    transition: all 0.05s;  /* Simple transition for hover effect */
 +
}
 +
table.tableizer-table th {
 +
    background: #abf;  /* Darken header a bit */
 +
    font-weight: 700;
 +
    height: 50px;
 +
}
 +
table.tableizer-table td {
 +
    text-align: center;
 +
}
 +
table.tableizer-table tr:nth-child(even) td { background: #DDD; }
 +
table.tableizer-table tr:nth-child(odd) td { background: #EEE; }
 +
 +
table.tableizer-table tr:hover td {
 +
  background-color: #CCF;
 
}
 
}
  
Line 491: Line 529:
 
     background-color: #333;
 
     background-color: #333;
 
     position: fixed;
 
     position: fixed;
−
     top: 18px;
+
     top: 17px;
 
     height: 32px;
 
     height: 32px;
 
     width: 100%;
 
     width: 100%;
Line 503: Line 541:
 
     margin:0;
 
     margin:0;
 
     padding:0 0 0 20%;
 
     padding:0 0 0 20%;
−
   
 
 
}
 
}
 
#primary_nav_wrap ul a
 
#primary_nav_wrap ul a
Line 524: Line 561:
 
     margin:0;
 
     margin:0;
 
     padding:0;
 
     padding:0;
−
 
 
}
 
}
 
#primary_nav_wrap ul li.current-menu-item
 
#primary_nav_wrap ul li.current-menu-item
Line 533: Line 569:
 
{
 
{
 
     background-color:rgba(160, 192, 239, 0.25);
 
     background-color:rgba(160, 192, 239, 0.25);
 +
    transition: all .1s ease-out;
 +
    cursor: pointer
 
}
 
}
 
#primary_nav_wrap ul ul
 
#primary_nav_wrap ul ul
 
{
 
{
−
    display:none;
 
 
     position:absolute;
 
     position:absolute;
 
     top:100%;
 
     top:100%;
 
     left:0;
 
     left:0;
 
     background-color:rgba(15, 19, 25, 0.7);
 
     background-color:rgba(15, 19, 25, 0.7);
−
     padding:0
+
     padding:0;
 +
    transition: all .2s ease-out;
 +
    opacity: 0; /* for anim display:none; -> display:block; */
 +
    visibility: hidden;
 +
    margin: -20px 0 0 0;
 
}
 
}
 
#primary_nav_wrap ul ul li
 
#primary_nav_wrap ul ul li
 
{
 
{
 
     float:none;
 
     float:none;
−
     width:200px
+
     width:200px;
 
}
 
}
 
#primary_nav_wrap ul ul a
 
#primary_nav_wrap ul ul a
 
{
 
{
 
     line-height:120%;
 
     line-height:120%;
−
     padding:10px 15px
+
     padding:10px 15px;
 
}
 
}
 
#primary_nav_wrap ul li:hover > ul
 
#primary_nav_wrap ul li:hover > ul
 
{
 
{
−
     display:block
+
     opacity: 1;
 +
    visibility: visible;
 +
    margin: 0;
 +
 
 
}
 
}
  
Line 580: Line 624:
  
  
−
<!-- start of content -->
+
<!-------------- start of content ------------>
 +
 
 
<!--<div class="igem_2017_content_wrapper">-->
 
<!--<div class="igem_2017_content_wrapper">-->
 
<nav>
 
<nav>
−
<div id="primary_nav_wrap" style="z-index: 2000">
+
<div id="primary_nav_wrap" style="z-index: 2000">
−
<ul>
+
  <ul>
−
  <li><a href="https://2017.igem.org/Team:Groningen">Home</a></li>
+
   <li class="mobicon"> <a href="javascript:void(0);" onclick="mobnavtoggle()">≡ Menu</a></li>
−
  <li style=""><a href="https://2017.igem.org/Team:Groningen/Description">Project</a>
+
  <li><a href="https://2017.igem.org/Team:Groningen">Home</a></li>
−
   <ul>
+
  <li><a onclick="">Project</a>
−
      <li><a href="https://2017.igem.org/Team:Groningen/Description">Description</a></li>
+
−
      <li><a href="https://2017.igem.org/Team:Groningen/Model">Model</a></li>
+
−
      <li><a href="https://2017.igem.org/Team:Groningen/Design">Design</a></li>
+
−
      <li><a href="https://2017.igem.org/Team:Groningen/Results">Results</a></li>
+
−
      <li><a href="https://2017.igem.org/Team:Groningen/Notebook">Notebook</a></li>
+
−
      <li><a href="https://2017.igem.org/Team:Groningen/FutureResearch">Future Research</a></li>
+
−
      <li><a href="https://2017.igem.org/Team:Groningen/Protocols">Protocols</a></li>
+
−
      <li><a href="https://2017.igem.org/Team:Groningen/InterLab">InterLab</a></li>
+
−
    </ul></li>
+
−
  <li><a href="https://2017.igem.org/Team:Groningen/Overview">Human Practices</a>
+
 
     <ul>
 
     <ul>
−
      <li><a href="https://2017.igem.org/Team:Groningen/Overview">Overview</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Description">Description</a></li>
−
      <li><a href="https://2017.igem.org/Team:Groningen/HP/Silver">Human Practices (Silver)</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Model">Model</a></li>
−
      <li><a href="https://2017.igem.org/Team:Groningen/HP/Gold_Integrated">Integrated (Gold)</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Design">Design</a></li>
−
      <li><a href="https://2017.igem.org/Team:Groningen/Engagement">Public Engagement</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Results">Results</a></li>
−
      <li><a href="https://2017.igem.org/Team:Groningen/Applied_Design">Applied Design</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Notebook">Notebook</a></li>
−
      <li><a href="https://2017.igem.org/Team:Groningen/FutureOutlook">Future Outlook</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/FutureResearch">Future Research</a></li>
−
      <li><a href="https://2017.igem.org/Team:Groningen/Safety">Safety</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Protocols">Protocols</a></li>
−
    </ul></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/InterLab">InterLab</a></li>
−
  <li><a href="https://2017.igem.org/Team:Groningen/Parts">Parts</a>
+
    </ul>
−
  </li>
+
  </li>
−
  <li><a href="https://2017.igem.org/Team:Groningen/Collaborations">Collaborations</a>
+
  <li><a onclick="">Human Practices</a>
−
  </li>
+
−
  <li><a href="https://2017.igem.org/Team:Groningen/Team">Team</a>
+
 
     <ul>
 
     <ul>
−
      <li class="dir"><a href="https://2017.igem.org/Team:Groningen/Team">Team Members</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Overview">Overview</a></li>
−
      <li class="dir"><a href="https://2017.igem.org/Team:Groningen/Achievements">Achievements</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/HP/Silver">Human Practices (Silver)</a></li>
−
      <li class="dir"><a href="https://2017.igem.org/Team:Groningen/Attributions">Attributions</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/HP/Gold_Integrated">Integrated (Gold)</a></li>
−
      <li class="dir"><a href="https://2017.igem.org/Team:Groningen/Fun">Fun Activities</a></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Engagement">Public Engagement</a></li>
−
     </ul></li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Applied_Design">Applied Design</a></li>
−
  <li><a href="https://2017.igem.org/Team:Groningen/Sponsors">Sponsors</a>
+
    <li><a href="https://2017.igem.org/Team:Groningen/FutureOutlook">Future Outlook</a></li>
−
</li>
+
    <li><a href="https://2017.igem.org/Team:Groningen/Safety">Safety</a></li>
−
</ul>
+
    </ul>
−
</div>
+
  </li>
 +
  <li><a href="https://2017.igem.org/Team:Groningen/Parts">Parts</a></li>
 +
  <li><a href="https://2017.igem.org/Team:Groningen/Collaborations">Collaborations</a></li>
 +
  <li><a onclick="">Team</a>
 +
    <ul>
 +
    <li class="dir"><a href="https://2017.igem.org/Team:Groningen/Team">Team Members</a></li>
 +
    <li class="dir"><a href="https://2017.igem.org/Team:Groningen/Achievements">Achievements</a></li>
 +
    <li class="dir"><a href="https://2017.igem.org/Team:Groningen/Attributions">Attributions</a></li>
 +
    <li class="dir"><a href="https://2017.igem.org/Team:Groningen/Fun">Fun Activities</a></li>
 +
     </ul>
 +
  </li>
 +
  <li><a href="https://2017.igem.org/Team:Groningen/Sponsors">Sponsors</a></li>
 +
  </ul>
 +
</div>
 
</nav>
 
</nav>
  
−
<!-- The Modal -->
+
<!------------- toggle mobile menu ----------->
 +
<script>
 +
function mobnavtoggle() {
 +
document.getElementByID("primary_nav_wrap").classList.toggle("mobnav");
 +
}
 +
</script>
 +
 
 +
<style>
 +
.mobicon {display:none;}
 +
</style>
 +
 
 +
<!-------------- The Modal ---------------->
 +
 
 
<div id="myModal" class="modal">
 
<div id="myModal" class="modal">
 
   <img class="modal-content" id="img01">
 
   <img class="modal-content" id="img01">
Line 635: Line 693:
 
</div>
 
</div>
  
 +
 +
<!------------ header slider ---------------->
 +
 +
<style>
 +
.mySlides {display:none}
 +
.slideshow-container {
 +
  position: relative;
 +
  margin: auto;
 +
}
 +
.header_title {
 +
  color: green; //#00a94d;
 +
}
 +
.slideshow-container img {
 +
  filter: blur(3px);
 +
  width:100%;
 +
  height:350px;
 +
  object-fit: cover;
 +
}
 +
_:-ms-fullscreen, :root .ie11up { /* fucking piece of shit m$ */
 +
.slideshow-container img {
 +
  background-size: cover;
 +
  background-position: center center;
 +
}
 +
 +
}
 +
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) { 
 +
.slideshow-container img {
 +
  background-size: cover;
 +
  background-position: center center;
 +
}
 +
}
 +
/* Caption text */
 +
.slidetext {
 +
  position: absolute;
 +
  bottom: 275px;
 +
  height:50px;
 +
  width: 100%;
 +
  text-align: center;
 +
}
 +
/* The dots/bullets/indicators */
 +
.dot {
 +
  height: 15px;
 +
  width: 15px;
 +
  margin: 0 2px;
 +
  background-color: #bbb;
 +
  border-radius: 50%;
 +
  display: inline-block;
 +
  transition: background-color 0.6s ease;
 +
}
 +
.activeslide {
 +
  background-color: #717171;
 +
}
 +
/* Fading animation */
 +
.fade {
 +
  -webkit-animation-name: fade;
 +
  -webkit-animation-duration: 1.5s;
 +
  animation-name: fade;
 +
  animation-duration: 1.5s;
 +
}
 +
@-webkit-keyframes fade {
 +
  from {opacity: .4}
 +
  to {opacity: 1}
 +
}
 +
@keyframes fade {
 +
  from {opacity: .4}
 +
  to {opacity: 1}
 +
}
 +
/* On smaller screens, decrease text size */
 +
@media only screen and (max-width: 300px) {
 +
  .slidetext {font-size: 11px}
 +
}
 +
/* remove old header bg shitstyle */
 +
.header {
 +
display: none;
 +
}
 +
</style>
 +
 +
<div class="slideshow-container">
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/0/03/2017-10-14_19.37.13.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/a/ae/2017-10-17_14.37.13.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/4/43/2017-10-17_14.37.07.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/b/bd/2017-10-14_19.38.08.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/f/ff/2017-10-14_19.37.42.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/7/73/20171027_123215.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/f/fb/20171027_123230.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/0/06/20171027_123249.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
<div class="mySlides fade">
 +
  <img src="https://static.igem.org/mediawiki/2017/a/a0/20171101_225544.jpg" style="width:100%">
 +
  <div class="slidetext"><h2 class="header_title"></h2></div>
 +
</div>
 +
</div>
 +
 +
<br>
 +
 +
<div style="text-align:center">
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
  <span class="dot"></span>
 +
</div>
 +
 +
<script>
 +
 +
$( document ).ready(function() {
 +
stringPathName = window.location.pathname
 +
switch (stringPathName) {
 +
    case "/Team:Groningen":
 +
        HTit = "IMPACT";
 +
        break;
 +
    case "/Team:Groningen/Description":
 +
        HTit = "DESCRIPTION";
 +
        break;
 +
    case "/Team:Groningen/Model":
 +
        HTit = "MODEL";
 +
        break;
 +
    case "/Team:Groningen/Design":
 +
        HTit = "DESIGN";
 +
        break;
 +
    case "/Team:Groningen/Results":
 +
        HTit = "RESULTS";
 +
        break;
 +
    case "/Team:Groningen/Notebook":
 +
        HTit = "NOTEBOOK";
 +
        break;
 +
    case "/Team:Groningen/FutureResearch":
 +
        HTit = "FUTURE RESEARCH";
 +
        break;
 +
    case "/Team:Groningen/Protocols":
 +
        HTit = "PROTOCOLS";
 +
        break;
 +
    case "/Team:Groningen/InterLab":
 +
        HTit = "INTERLAB";
 +
        break;
 +
    case "/Team:Groningen/Overview":
 +
        HTit = "OVERVIEW";
 +
        break;
 +
    case "/Team:Groningen/HP/Silver":
 +
        HTit = "HUMAN PRACTICES";
 +
        break;
 +
    case "/Team:Groningen/HP/Gold_Integrated":
 +
        HTit = "INTEGRATED";
 +
        break;
 +
    case "/Team:Groningen/Engagement":
 +
        HTit = "ENGAGEMENT";
 +
        break;
 +
    case "/Team:Groningen/Applied_Design":
 +
        HTit = "APPLIED DESIGN";
 +
        break;
 +
    case "/Team:Groningen/FutureOutlook":
 +
        HTit = "FUTURE OUTLOOK";
 +
        break;
 +
    case "/Team:Groningen/Safety":
 +
        HTit = "SAFETY";
 +
        break;
 +
    case "/Team:Groningen/Parts":
 +
        HTit = "PARTS";
 +
        break;
 +
    case "/Team:Groningen/Collaborations":
 +
        HTit = "COLLABORATIONS";
 +
        break;
 +
    case "/Team:Groningen/Team":
 +
        HTit = "TEAM MEMBERS";
 +
        break;
 +
    case "/Team:Groningen/Achievements":
 +
        HTit = "ACHIEVEMENTS";
 +
        break;
 +
    case "/Team:Groningen/Attributions":
 +
        HTit = "ATTRIBUTIONS";
 +
        break;
 +
    case "/Team:Groningen/Fun":
 +
        HTit = "FUN ACTIVITIES";
 +
        break;
 +
    case "/Team:Groningen/Sponsors":
 +
        HTit = "SPONSORS";
 +
        break;
 +
    default:
 +
        HTit = "Sudazima";
 +
        break;
 +
}
 +
var elements = document.getElementsByClassName("header_title");
 +
for(var i = 0, length = elements.length; i < length; i++) {
 +
elements[i].innerHTML = HTit;
 +
}
 +
});
 +
 +
 +
function showSlides() {
 +
    var i;
 +
    var slides = document.getElementsByClassName("mySlides");
 +
    var dots = document.getElementsByClassName("dot");
 +
    for (i = 0; i < slides.length; i++) {
 +
      slides[i].style.display = "none"; 
 +
    }
 +
    slideIndex++;
 +
    if (slideIndex > slides.length) {slideIndex = 1}   
 +
    for (i = 0; i < dots.length; i++) {
 +
        dots[i].className = dots[i].className.replace(" activeslide", "");
 +
    }
 +
    slides[slideIndex-1].style.display = "block"; 
 +
    dots[slideIndex-1].className += " activeslide";
 +
    setTimeout(showSlides, 6000); // Change image every 6 seconds
 +
}
 +
var slideIndex = Math.floor((Math.random() * 9) + 1);
 +
showSlides();
 +
 +
</script>
 +
 +
<!-------- banner image map ----------->
  
 
<map name="imagemap_sponsors" id="imagemapbanner">
 
<map name="imagemap_sponsors" id="imagemapbanner">
Line 667: Line 962:
 
     var origWidth = 3850;
 
     var origWidth = 3850;
 
     var origHeight = 770;
 
     var origHeight = 770;
−
   
 
 
     var banner = $('#bannerimg');
 
     var banner = $('#bannerimg');
 
     var map = $('map[name^="imagemap_sponsors"]');
 
     var map = $('map[name^="imagemap_sponsors"]');
−
   
 
 
     var newWidth = banner.innerWidth();
 
     var newWidth = banner.innerWidth();
 
     var newHeight = banner.innerHeight();
 
     var newHeight = banner.innerHeight();
−
   
 
 
     var dx = newWidth / origWidth;
 
     var dx = newWidth / origWidth;
 
     var dy = newHeight / origHeight;
 
     var dy = newHeight / origHeight;
−
   
 
 
     map.find('area').each(function() {
 
     map.find('area').each(function() {
 
         var coords = $(this).attr('coords').split(',');
 
         var coords = $(this).attr('coords').split(',');
Line 687: Line 978:
 
});
 
});
 
</script>
 
</script>
 +
 +
<!-------------- scrollspy ------------->
 +
 +
<style>
 +
 +
#myScrollspy
 +
{
 +
    top:400px;
 +
    background-color: #fff;
 +
    position: absolute;
 +
    width: 230px;
 +
    display:block;
 +
    //height: 100%;
 +
    margin-left: -270px; //main-col 750px
 +
}
 +
#myScrollspy ul
 +
{
 +
    list-style:none;
 +
    margin:0;
 +
    padding:0;
 +
}
 +
#myScrollspy ul a
 +
{
 +
    display:block; //block lenght a
 +
    max-width: 230px;
 +
    z-index: 2000;
 +
    width:100%;
 +
    height:100%;
 +
 +
    color: black;
 +
    text-decoration:none;
 +
    font-weight:600;
 +
    font-size:14px;
 +
    line-height:30px;
 +
    text-align:left;
 +
    padding: 2px 0px 2px 20px;
 +
}
 +
#myScrollspy ul li
 +
{
 +
    //display:block;
 +
    margin:0;
 +
    padding:0;
 +
}
 +
 +
#myScrollspy ul li.active {
 +
  background:green;
 +
  transition: all .1s ease-out;
 +
}
 +
#myScrollspy ul li.active:hover {
 +
  background-color:rgba(120, 255, 180, 0.5);
 +
  transition: all .1s ease-out;
 +
}
 +
#myScrollspy ul li:hover {
 +
  background-color:rgba(160, 192, 239, 0.5);
 +
  transition: all .1s ease-out;
 +
}
 +
 +
#myScrollspy.sticky {
 +
  position: fixed;
 +
  top: 48px;
 +
}
 +
 +
div.scrollcol {
 +
width:750px;
 +
}
 +
div.marginsnav {       
 +
  margin-left:250px;
 +
}
 +
</style>
 +
 +
<!-- fucking lol piece of shit igem site -->
 +
<script src="https://static.igem.org/mediawiki/2017/6/60/Scrollspy.txt"></script>
 +
 +
<script>
 +
// Add scrollspy to document
 +
//$( document ).ready(function() { $("body").scrollspy({target: "#myScrollspy", offset:100}); });
 +
 +
// Add smooth scrolling on all links inside the navbar
 +
 +
/*
 +
var animateScroll = function(target, offset, speed) {
 +
    var is = $(document).scrollTop();
 +
    var must = parseInt($(target).offset().top) + offset;
 +
    if (typeof speed == 'undefined') {
 +
        speed = Math.sqrt(Math.pow(is - must, 2)) / 75
 +
    }
 +
    var setTo;
 +
    if (is < must) {
 +
        setTo = is + speed;
 +
        if (setTo > must) {
 +
            setTo = must;
 +
        }
 +
    } else if (is > must) {
 +
        setTo = is - speed;
 +
        if (setTo < must) {
 +
            setTo = must;
 +
        }
 +
    }
 +
 +
    $(document).scrollTop(setTo);
 +
    if (setTo != must) {
 +
        setTimeout(function() {animateScroll(target, offset, speed);}, 10);
 +
    }
 +
}*/
 +
 +
var jump=function(e)
 +
{
 +
  if (e){
 +
      e.preventDefault();
 +
 +
      //$("body").scrollspy({target: "#myScrollspy", offset:100}); legion says this is bad nad dumb
 +
 +
      var target = $(this).attr("href");
 +
  }else{
 +
      var target = location.hash;
 +
  }
 +
 +
 +
  console.log(target);
 +
  $('html,body').animate (
 +
  {
 +
      scrollTop: $(target).offset().top - 90
 +
  },1000 );
 +
 +
//animateScroll(target, -90);
 +
 +
}
 +
 +
if ('scrollRestoration' in history) {
 +
  history.scrollRestoration = 'manual';
 +
}
 +
 +
$('html, body').hide();
 +
 +
$(document).ready(function() {
 +
$('a[href^="#snav"]').bind("click", jump);
 +
 +
    if (location.hash){
 +
        setTimeout(function(){
 +
            $('html, body').scrollTop(0).show();
 +
            $("body").scrollspy({target: "#myScrollspy", offset:100});
 +
            jump();
 +
        }, 0);
 +
    }else{
 +
        $('html, body').show();
 +
        $("body").scrollspy({target: "#myScrollspy", offset:100});
 +
    }
 +
});
 +
 +
</script>
 +
 +
<!-- PIECE OF SHIT POGRAMM BY GREEDY NEW WORLD ORDER M$ -->
 +
 +
<script>
 +
// Get IE or Edge browser version
 +
var versionshitie = detectIE();
 +
//document.getElementById('result').innerHTML = versionshitie;
 +
 +
function detectIE() {
 +
  var ua = window.navigator.userAgent;
 +
  var msie = ua.indexOf('MSIE ');
 +
  if (msie > 0) {
 +
    return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
 +
  }
 +
 +
  var trident = ua.indexOf('Trident/');
 +
  if (trident > 0) {
 +
    var rv = ua.indexOf('rv:');
 +
    return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
 +
  }
 +
  var edge = ua.indexOf('Edge/');
 +
  if (edge > 0) {
 +
    return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
 +
  }
 +
  return false;
 +
}
 +
 +
</script>
 +
 +
</html>

Latest revision as of 03:01, 2 November 2017