Team:USP-UNESP-Brazil/Templates/Header
From 2012.igem.org
(Difference between revisions)
Line 18: | Line 18: | ||
<div id="head"> | <div id="head"> | ||
- | <img id=" | + | <img id="imgExtras" class="images" src="https://static.igem.org/mediawiki/2012/3/36/ExtraImage.png" alt="Extras"/> |
- | <img id=" | + | <img id="imgAssocMem" class="images" src="https://static.igem.org/mediawiki/2012/1/1c/MANImage.png" alt="Memory Associative Network"/> |
- | <img id="imgPlugnPlay" src="https://static.igem.org/mediawiki/2012/2/2a/PPPImage.png" alt="Plasmid Plug'nPlay"/> | + | <img id="imgPlugnPlay" class="images" src="https://static.igem.org/mediawiki/2012/2/2a/PPPImage.png" alt="Plasmid Plug'nPlay"/> |
- | <img id=" | + | <img id="imgHackology" class="images" src="https://static.igem.org/mediawiki/2012/f/f5/POImage.png" alt="Project Overview"/> |
- | <img id=" | + | <img id="imgIntroduction" class="images" src="https://static.igem.org/mediawiki/2012/e/e8/IntroImage.png" alt="Introduction"/> |
</div> | </div> | ||
Line 38: | Line 38: | ||
images[3] = $("#imgAssocMem"); | images[3] = $("#imgAssocMem"); | ||
- | + | $(window).load(function() { //start after HTML, images have loaded | |
- | + | ||
- | $ | + | var InfiniteRotator = |
+ | { | ||
+ | init: function() | ||
+ | { | ||
+ | //initial fade-in time (in milliseconds) | ||
+ | var initialFadeIn = 800; | ||
+ | |||
+ | //interval between items (in milliseconds) | ||
+ | var itemInterval = 6000; | ||
+ | |||
+ | //cross-fade time (in milliseconds) | ||
+ | var fadeTime = 2500; | ||
+ | |||
+ | //count number of items | ||
+ | var numberOfItems = $("images").length; | ||
+ | |||
+ | //set current item | ||
+ | var currentItem = 0; | ||
+ | |||
+ | //show first item | ||
+ | $('.rotating-item').eq(currentItem).fadeIn(initialFadeIn); | ||
+ | |||
+ | //loop through the items | ||
+ | var infiniteLoop = setInterval(function(){ | ||
+ | $('.rotating-item').eq(currentItem).fadeOut(fadeTime); | ||
+ | |||
+ | if(currentItem == numberOfItems -1){ | ||
+ | currentItem = 0; | ||
+ | }else{ | ||
+ | currentItem++; | ||
+ | } | ||
+ | $('.rotating-item').eq(currentItem).fadeIn(fadeTime); | ||
+ | |||
+ | }, itemInterval); | ||
+ | } | ||
+ | }; | ||
+ | |||
+ | InfiniteRotator.init(); | ||
+ | |||
+ | }); | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
</script> | </script> |
Revision as of 02:20, 24 September 2012
Network