Difference between revisions of "Team:Utrecht/js/myFunctions"

Revision as of 11:29, 13 September 2018

function tellStory(story){ $("#story").html(story); }

// When the user scrolls the page, execute myFunction window.onscroll = function() {scrollFunction()};

function scrollFunction() {

 var winScroll = $(document).scrollTop();
 var height = $(document).height() - $(window).height();
 var scrolled = (winScroll / height) * 100;
 document.getElementById("myBar").style.height = scrolled + "%";

}

function scrollFunction2(id){ var scrollPos = $('#'+ id).offset(); window.scrollTo(0, scrollPos.top - 185); }

//Definitions of Submenus

var submenuProject = '<a href= "https://2018.igem.org/Team:Utrecht/ProjectOverview" id = "submenuProjectOverview"> Overview</a> <a href="https://2018.igem.org/Team:Utrecht/Description" id = "submenuDescription" >Description</a> <a href="https://2018.igem.org/Team:Utrecht/Design" id = "submenuDesign">Design</a> <a href="https://2018.igem.org/Team:Utrecht/Model" id = "submenuModel">Model</a> <a href="https://2018.igem.org/Team:Utrecht/Parts" id = "submenuBiobricks">Biobricks</a> <a href="https://2018.igem.org/Team:Utrecht/ProjectOverview" id = "submenuSafeByDesign">Safety&Risks</a>';

var submenuAboutUs = '<a href="https://2018.igem.org/Team:Utrecht/Team" id = "submenuTeam">Team</a> <a href="https://2018.igem.org/Team:Utrecht/TeamBuilding" id = "submenuTeamBuilding">Team Building</a>';

var submenuLab = '<a href="https://2018.igem.org/Team:Utrecht/Notebook" id = "submenuNotebook">Lab Notebook</a> <a href="https://2018.igem.org/Team:Utrecht/Protocol" id = "submenuProtocol">Protocol</a> <a href="https://2018.igem.org/Team:Utrecht/Safety" id = "submenuSafety">Safety</a> <a href="https://2018.igem.org/Team:Utrecht/Results" id = "submenuResults">Results</a> <a href="https://2018.igem.org/Team:Utrecht/InterLab" id = "submenuInterLab">Interlab</a>';

var submenuHP = '<a href="https://2018.igem.org/Team:Utrecht/IntegratedHP" id = "submenuIntegratedHP">Integrated HP</a> <a href="https://2018.igem.org/Team:Utrecht/PublicEngagement" id = "submenuPE">PE</a> <a href="https://2018.igem.org/Team:Utrecht/Collaborations" id = "submenuCollaborations">Collabs</a> <a href="https://2018.igem.org/Team:Utrecht/MeetUps" id = "submenuMeetUps">Meet-Ups</a>';

var submenuJamboree = '<a href="https://2018.igem.org/Team:Utrecht/Vlogs" id = "submenuVlogs">Vlogs</a> <a href="https://2018.igem.org/Team:Utrecht/AfterJamboree" id = "submenuAJ">After Jamboree</a>';

var submenuCredit = '<a href="https://2018.igem.org/Team:Utrecht/Attributions" id = "submenuAtributions">Attributions</a> <a href="https://2018.igem.org/Team:Utrecht/Sponsors" id = "submenuSponsors">Sponsors</a>';

//Changes Submenu

$(document).ready(function(){

$("#menuProject").hoverIntent(function(){

       $("#mySubmenu").stop();

$("#mySubmenu").html(submenuProject);

       $(defActive).addClass('active');

});

$("#menuAboutUs").hoverIntent(function(){

       $("#mySubmenu").stop();

$("#mySubmenu").html(submenuAboutUs);

       $(defActive).addClass('active');

});

$("#menuLaboratory").hoverIntent(function(){

       $("#mySubmenu").stop();

$("#mySubmenu").html(submenuLab);

       $(defActive).addClass('active');

});

$("#menuHumanPractices").hoverIntent(function(){

       $("#mySubmenu").stop();

$("#mySubmenu").html(submenuHP);

       $(defActive).addClass('active');

});

$("#menuJamboree").hoverIntent(function(){

       $("#mySubmenu").stop();

$("#mySubmenu").html(submenuJamboree);

       $(defActive).addClass('active');

});

$("#menuCredit").hoverIntent(function(){

       $("#mySubmenu").stop();

$("#mySubmenu").html(submenuCredit);

       $(defActive).addClass('active');

});

$(".topnav").mouseleave(resetSubmenu);

});

var defSubmenu = ; var defActive = ;

var resetSubmenu = function(){ $("#mySubmenu").html(defSubmenu);

       $(defActive).addClass('active');

}

//Mobile Menu /* Toggle between adding and removing the "responsive" class to topnav when the user clicks on the icon */ function myFunction(y) {

   var x = document.getElementById("myMenu");
   if (x.className === "menuM") {
       x.className += " open";
   } else {
       x.className = "menuM";
   }

y.classList.toggle("change"); }