Line 209: | Line 209: | ||
<div id="div-frame"> | <div id="div-frame"> | ||
+ | </div> | ||
+ | <div class="tourGuide"> | ||
+ | <img src="https://static.igem.org/mediawiki/2016/2/26/T--UMaryland--newlogo.jpeg" id="img-logoNav"> | ||
+ | <p id="guideLine1" class="guideText">Welcome to the virtual tour for the 2016 UMaryland iGEM Project: Biosequestration of Methane!</p> | ||
+ | <p id="guideLine2" class="guideText">We have a lot to show you about our work and are excited to show you what we have done!</p> | ||
+ | <p id="guideLine3" class="guideText">Click next to proceed through the tour!</p> | ||
+ | <a class="guideProceed" onclick="slideshowProceed">Next →</a> | ||
</div> | </div> | ||
</div> | </div> | ||
<style> | <style> | ||
+ | .guideProceed { | ||
+ | position: absolute; | ||
+ | color: blue !important; | ||
+ | text-decoration: underline; | ||
+ | right: 250px; | ||
+ | left: auto; | ||
+ | top: 55px; | ||
+ | font-weight: 800; | ||
+ | bottom: auto; | ||
+ | cursor: pointer; | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .tourGuide { | ||
+ | display: none; | ||
+ | position: absolute; | ||
+ | top: 18px; | ||
+ | bottom: auto; | ||
+ | height: 120px; | ||
+ | width: 100%; | ||
+ | left: 0px; | ||
+ | right: auto; | ||
+ | background-color: white; | ||
+ | } | ||
+ | |||
+ | .guideText { | ||
+ | display: none; | ||
+ | font-weight: 400; | ||
+ | margin-left: 400px; | ||
+ | color: black; | ||
+ | max-width: 800px; | ||
+ | } | ||
+ | |||
+ | #img-logoNav{ | ||
+ | display: none; | ||
+ | margin-left: 50px; | ||
+ | margin-top: 42px; | ||
+ | width: 260px; | ||
+ | float: left; | ||
+ | } | ||
+ | |||
#div-frame { | #div-frame { | ||
position: absolute; | position: absolute; | ||
Line 334: | Line 382: | ||
window.clearTimeout(timeoutID2); | window.clearTimeout(timeoutID2); | ||
var left = $(document).outerWidth(true); | var left = $(document).outerWidth(true); | ||
− | $('#div-frame').css('z-index',' | + | $('#div-frame').css('z-index','1000') |
$('#div-frame').css('left', left); | $('#div-frame').css('left', left); | ||
$('.tourFrame').css('display','block') | $('.tourFrame').css('display','block') | ||
$('#div-frame').css('display','block'); | $('#div-frame').css('display','block'); | ||
+ | |||
+ | $('.tourGuide').css('z-index','10000') | ||
+ | $('.tourGuide').css('left', left); | ||
+ | $('.tourGuide').css('display','block'); | ||
+ | |||
$('#div-frame').animate({left:0},2000); | $('#div-frame').animate({left:0},2000); | ||
+ | $('.tourGuide').animate({left:0},2000); | ||
timeoutID = window.setTimeout(destroyVid, 2000); | timeoutID = window.setTimeout(destroyVid, 2000); | ||
slide = 0; | slide = 0; | ||
Line 377: | Line 431: | ||
$('nav, #small, #h3, #h2, #img-logo, .hide, .tour').remove(); | $('nav, #small, #h3, #h2, #img-logo, .hide, .tour').remove(); | ||
$('.covervid-wrapper').remove(); | $('.covervid-wrapper').remove(); | ||
+ | timeoutID = window.setTimeout(slide1p1, 2000); | ||
+ | } | ||
+ | |||
+ | function slide1p1() { | ||
+ | $('#img-logoNav, #guideLine1').animateCss('fadeInUp'); | ||
+ | $('#img-logoNav, #guideLine1').css('display','block'); | ||
+ | timeoutID = window.setTimeout(slide1p2, 800); | ||
+ | } | ||
+ | |||
+ | function slide1p2() { | ||
+ | $('#guideLine2').animateCss('fadeInUp'); | ||
+ | $('#guideLine2').css('display','block'); | ||
+ | timeoutID = window.setTimeout(slide1p3, 800); | ||
+ | } | ||
+ | |||
+ | function slide1p3() { | ||
+ | $('#guideLine3, .guideProceed').animateCss('fadeInUp'); | ||
+ | $('#guideLine3, .guideProceed').css('display','block'); | ||
} | } | ||
</script> | </script> | ||
</html> | </html> |
Revision as of 01:44, 6 September 2016
</div></div>
Biosequestration of Methane
Creating a strain of E. coli that break down methane to be implemented into landfills as an environmentally friendly strategy for ameliorating global climate change
Take our
virtual tour!
Welcome to the virtual tour for the 2016 UMaryland iGEM Project: Biosequestration of Methane!
We have a lot to show you about our work and are excited to show you what we have done!
Click next to proceed through the tour!
Next →