Line 49: | Line 49: | ||
if (tlProgress == 0) {aboutArrowsDisappear();} | if (tlProgress == 0) {aboutArrowsDisappear();} | ||
else { | else { | ||
− | ArrowsDisappearDelay = setTimeout(function(){ aboutArrowsDisappear(); }, (tlProgress*tlDuration+0. | + | ArrowsDisappearDelay = setTimeout(function(){ aboutArrowsDisappear(); }, (tlProgress*tlDuration+0.25)*1000); |
} | } | ||
}); | }); |
Revision as of 10:23, 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}), $svgAbout = $('svg').drawsvg(), $aboutTab = document.getElementById("coverAboutTab"), p = 0, arrowSel = 0, coverWindowHeight = $(window).height(), tlPlayDelay, ArrowsDisappearDelay, tlDuration = 0.1;
/*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, tlDuration, {left:"-=10px", autoAlpha:0.2}, 0.05, 0) .staggerFrom($coverAboutAttributionSpans, tlDuration, {left:"-=10px", opacity:0.2}, 0.05, 0); $coverAbout.click(function(){console.log(1);}); $coverAbout.hover( function() { console.log(500-p+"its on"); $aboutTab.style.background = "url() 0 0"; aboutArrowsAppear(); clearTimeout(ArrowsDisappearDelay); if (p == 100){tlCoverAbout.play();} else { tlPlayDelay = setTimeout(function(){ tlCoverAbout.play(); }, 500-p); } }, function() { var tlProgress = tlCoverAbout.progress(); console.log("its off"); tlCoverAbout.reverse(); clearTimeout(tlPlayDelay); $aboutTab.style.background = "url() 0 0"; if (tlProgress == 0) {aboutArrowsDisappear();} else { ArrowsDisappearDelay = setTimeout(function(){ aboutArrowsDisappear(); }, (tlProgress*tlDuration+0.25)*1000); } }); 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; }
});