icraft-websites
Members-
Posts
35 -
Joined
-
Last visited
Contact Methods
- Personal Website
Profile Information
-
Location
New Zealand
-
Interests
Websites, Branding, Digital content
Recent Profile Visitors
4,125 profile views
icraft-websites's Achievements
2
Reputation
-
icraft-websites changed their profile photo
-
Hey forums. Iv'e run into an issue when passing data into a scroll event listener to fire a callback with preset variables. The settings.in.func callback fires repeatedly instead of once and the vars object wont be accpeted in the TweenMax vars parameter. The Code pen link provides this behavior when scrolling down.
-
Hey there. In my Project I use allot of Tweens. At a specific point it wish to reset all current tweens excluding a select few. I wish to store a variable on these Tween to exclude so when resetting all the current tweens these can be tracked an avoided. I've tried this sofar but when assigning the failed tag SStimer return undefined. Yet I can access this tween when using TweenMax.getAllTweens()[index]. Am i Missing something major here? trigger.SStimer = new TimelineMax({delay: 180}) .call(function () { console.log('Slow selection fired'); delete this }); trigger.SSTimer.failedTag = true;
-
drawSVG IE10 circle stroke animation glitchey
icraft-websites replied to icraft-websites's topic in GSAP
Awesome, thanks for the links. I will look into them! -
drawSVG IE10 circle stroke animation glitchey
icraft-websites replied to icraft-websites's topic in GSAP
Thanks for the Quick Reply. Yeah I tried that too, really need the stroke too fill up the whole gray background. Any other thoughts on how to achieve this effect using SVG? I can do it using canvas but I use drawSVG in many other places on my site and want to stick with one method of animating these effects. -
Hey there. Seem to be having some issues with the draw SVG plugin on IE when trying to animate a circles stroke around a central point to fill up the background. The Problem only occurs on IE When the dial type animation becomes glitchey. The Codepen example shows this.
-
Im trying to implement a similar issue using lagSmoothing(0); but have noticed that my delayed calls and TweenMax.to(elm, duration, {properties}); beecome out of sync when going to a different tab. The TweenMax.to runs in the background accordingly but the delayedCall (used as a interval counter) then starts slowing down and the intervals increase when off tab. The impObj.timers.ticker & the impObj.timers.autoChangeTimer become of out of sync but the impObj.timers.startBar stays in time. NOTE: Im using knockout bindings to update some elements on delayedCall intervals. function buildImpressionTimers() { delete choice.impressionObjs.timers.ready_timer; var impObj = choice.impressionObjs; impObj.timers.autoChangeTimer = TweenMax.delayedCall(impObj.settings.slide_time, autoChangeImpression, impObj]); impObj.timers.ticker = TweenMax.delayedCall(1, updateImpressionTime, [impObj]); impObj.timers.startBar = TweenMax.to(getElm(impObj.timerBar, '#choose-timer-bar'), choice.choose_total_t ime(), { x: -getElm(impObj.timerBar, '#choose-timer-bar').width() + 31, ease: Linear.easeNone, onComplete: endImpressionSession }); } function updateImpressionTime(impObj) { var time = choice.choose_total_time, state = choice.state(); time(time() - 1); if (time() === 3) { if (impObj.bonusCount <= impObj.bonusCountLimit && impObj.bonus !== 'awarded' && impObj.bonus !== 'prevent ') { impObj.bonus = 'award'; } state.stage_percent(state.stage_total() - 1); animatePercentBar(0, 'increase', 1.5, 'all'); } if (time() <= 1) { changeImpressionButton(getElm(choice.impressionObjs.timerButton, '#choose-buttons > .button'), '#dedede'); choice.transitioning = true; disableAbout(1.5); } else { this.restart(true); } }
-
Was exactly was I was looking for. Had to update my version of the plugin though. Thanks!!!!! Couldn't find this in the documentation though. Cheers! Josh
- 3 replies
-
- javascript
- scrollto
-
(and 1 more)
Tagged with:
-
Hey, I've been using the scrollTo plugin extensively throughout my web app and up until now its been running great. I just came across a use case that requires an event to fire when the user manually scroll's while the scrollTo plugin is auto scrolling. Does scrollTo have a callback that fires when the scroll is killed by a manual scroll? I've tried onComplete but that only fires if the whole auto scroll finishes before any manual scroll event. Thanks Josh
- 3 replies
-
- javascript
- scrollto
-
(and 1 more)
Tagged with:
-
Hey there, I'm trying to create a repeating delayedCall to countdown 45 second and wish to pass itself ('this') into the parameter. But when I hit the barTimer.restart(true); call it gives me undefined error. Do I have to declare the delayed Call as an variable so that it can be passed as a parameter? function pre_baserate_loading() { var loadingText = ['Searching Similar Preferences.', 'Retrieving Products Purchased.', 'Examining Real-World Experiences.', 'Eliminating Inadequate Products.', 'Retrieving Results.' , 'Codifying Results.']; var textLength = loadingText.length; var count = 1; var duration = 45; var barTimer = TweenMax.delayedCall(duration / textLength, updateLoadingBar, [count, barTimer, textLength, loadingTextr]); } function updateLoadingBar(count, timer, textLength, loadingText) { if (count >= textLength) { timer.kill(); timer = null; } else { count++; if (timer) { timer.restart(true); } } }
-
Hey there, I'm trying to use the same tween to push a slider to different positions using the CSS top value and use the updateTo call to change the top position to slide to. this is what I have got function buildQuestionsTweens(){ //builds the tween when slide element is ready slideToQuestionTween = TweenMax.to(getElm(decideSlider, '#decide-slider'), 0.5, {top:0}); } function slide_to_question(slide){ // gets called when slide location is selected slideToQuestionTween.updateTo({top: '-' + slide * 100 + '%'}, true); } the slider isnt being tweened after is call the updateTo.
-
Draggable rotation breaks on Firefox and IE not on Chrome
icraft-websites replied to icraft-websites's topic in GSAP
I fixed and and it seems to be working but my source code is allot more comprehensive and still breaking. I have the latest version too. It's odd, Ive stripped back everything but I still cant seem to find it. -
Draggable rotation breaks on Firefox and IE not on Chrome
icraft-websites replied to icraft-websites's topic in GSAP
This is a code pen I just made for it and breaks on IE and FireFox but not chrome http://codepen.io/joshscorrar/pen/blkaf -
Draggable rotation breaks on Firefox and IE not on Chrome
icraft-websites replied to icraft-websites's topic in GSAP
I will try and put up a codepen when I get the time. It appears clockTimerDegrees get's NaN after. clockTimerDegrees = this.rotation; (the rotation value appears to be NaN ) and it changes the data type, this happens only in IE and Firefox but not chrome. :S -
Hey there, I have been using your Draggable on Chrome and it works fine when testing on chrome but when I try it on Firefox an IE it jitters and resets back to 0. Here is the core of the code. I have a feeling its something to do with support for the 'drag.target._gsTransform.rotation' across browser but I'm not sure. Draggable.create(minute, {type: "rotation", onDrag: function(e){ if(!clockTimerFinished){ var drag = Draggable.get(minute); clockTimerDegrees = Math.floor(drag.target._gsTransform.rotation); clockTimerTime = Math.floor(clockTimerDegrees / 360 * totalTimeInSeconds); clock.val(clockTimerTime).trigger('change'); checkTimerPercent( timerPercent, clock, svgColor); if(clockTimerTime >= totalTimeInSeconds && !clockTimerFinished){ } } }});
-
Choice, This will help to clean up my code a bit more, thanks.