Line 29: | Line 29: | ||
.staggerFrom($coverAboutTeamSpans, 0.1, {left:"-=10px", autoAlpha:0.2}, 0.05, 0.8) | .staggerFrom($coverAboutTeamSpans, 0.1, {left:"-=10px", autoAlpha:0.2}, 0.05, 0.8) | ||
.staggerFrom($coverAboutAttributionSpans, 0.1, {left:"-=10px", opacity:0.2}, 0.05, 0.8); | .staggerFrom($coverAboutAttributionSpans, 0.1, {left:"-=10px", opacity:0.2}, 0.05, 0.8); | ||
− | $ | + | $coverAbout.click(function(){console.log(1);}); |
$coverAbout.hover( | $coverAbout.hover( | ||
function() { | function() { | ||
Line 40: | Line 40: | ||
tlCoverAbout.reverse(); | tlCoverAbout.reverse(); | ||
$aboutTab.style.background = "url(https://static.igem.org/mediawiki/2016/5/52/T--Hong_Kong_HKUST--singleStrand.png) 0 0"; | $aboutTab.style.background = "url(https://static.igem.org/mediawiki/2016/5/52/T--Hong_Kong_HKUST--singleStrand.png) 0 0"; | ||
− | + | aboutArrowsDisappear(); | |
− | } | + | }); |
− | + | ||
var myArrow = setInterval(function(){ | var myArrow = setInterval(function(){ | ||
if (arrowSel == 1) { | if (arrowSel == 1) { | ||
Line 61: | Line 60: | ||
} | } | ||
}, 1); | }, 1); | ||
− | function aboutArrowsAppear(){ | + | function aboutArrowsAppear(){ arrowSel = 1; } |
− | + | function aboutArrowsDisappear(){ arrowSel = 2; } | |
− | + | ||
− | function aboutArrowsDisappear(){ | + | |
− | + | ||
− | + | ||
}); | }); |
Revision as of 04:28, 17 August 2016
$(document).ready(function(){
var $coverAboutTeam = $('#coverAboutTeam'), $coverAboutAttribution = $('#coverAboutAttribution'), $coverAbout = $('#coverAbout');
$coverAboutAttribution.lettering(); // wrap around each character within the element
$coverAboutTeam.lettering();
var $coverAboutTeamSpans = $coverAboutTeam.find('span'), $coverAboutAttributionSpans = $coverAboutAttribution.find('span'), tlCoverAbout = new TimelineMax({ paused: true, onStart: aboutArrowsAppear }), $svgAbout = $('svg').drawsvg(), $aboutTab = document.getElementById("coverAboutTab"), p = 0, arrowSel = 0, coverWindowHeight = $(window).height();
/*Variable for strand centering*/
console.log(coverWindowHeight); document.getElementById("content_wrapper").style.height = coverWindowHeight + "px"; var contentHeight = document.getElementById("content_wrapper").style.height; console.log(contentHeight);
/*Animation*/
tlCoverAbout .staggerFrom($coverAboutTeamSpans, 0.1, {left:"-=10px", autoAlpha:0.2}, 0.05, 0.8) .staggerFrom($coverAboutAttributionSpans, 0.1, {left:"-=10px", opacity:0.2}, 0.05, 0.8); $coverAbout.click(function(){console.log(1);}); $coverAbout.hover( function() { console.log("its on"); $aboutTab.style.background = "url() 0 0"; tlCoverAbout.play(); }, function() { console.log("its off"); tlCoverAbout.reverse(); $aboutTab.style.background = "url(
) 0 0"; aboutArrowsDisappear(); }); var myArrow = setInterval(function(){ if (arrowSel == 1) { if (p == 100) {} else { p+=1; $svgAbout.drawsvg('progress', p/100); console.log(p); } } else if (arrowSel ==2){ if (p == 0){} else { p-=1; $svgAbout.drawsvg('progress', p/100); console.lo(p); } } }, 1); function aboutArrowsAppear(){ arrowSel = 1; } function aboutArrowsDisappear(){ arrowSel = 2; }
});