Search the Community
Showing results for tags 'custom property'.
Found 2 results
-
Hi, maybe you remember, I have created a custom animated property for the filter blur property. I think it has a bug, but I'm not sure, I think you can help me out. I know that my timeline contains non optimized code, but it is the simplier version of the real code and it is made to be able to show the bug. If you reduce it to one timeline it will work fine, I know First timeline animates the box from opacity 0 to 1. x and n2blur is there to make sure the properties stays at 0. After it completes, it starts the second timeline from 0s. Second timeline animates the same box and moves it to x:200 and blur:5. If you click on red box, the first timeline plays from the start. After the page load the timeline1 starts ......... then we reach the end of the second timeline too. At this point, everything is fine. Then click on the red box, It jumps back to opacity:0 and x:0, which is great, but it does NOT jump to blur:0 and this is what my problem is. I would like to behave like the in-built x property behaves and resets itself with the from value which applied in the first timeline. window.n2FilterProperty = false; var element = document.createElement("div"); if (/Edge\/\d./i.test(navigator.userAgent)) { //Edge has buggy filter implementation } else if (element.style.webkitFilter !== undefined) { window.n2FilterProperty = "webkitFilter"; } else if (element.style.filter !== undefined) { window.n2FilterProperty = "filter"; } if (window.n2FilterProperty) { _gsScope.CSSPlugin.registerSpecialProp( "n2blur", function(target, value, tween) { var start = 0, match; if ( (match = target.style[window.n2FilterProperty].match(/blur\((.+)?px\)/)) ) { start = parseFloat(match[1]); } if (start == value) { return function() {}; } var diff = value - start; return function(ratio) { target.style[window.n2FilterProperty] = "blur(" + (start + diff * ratio) + "px)"; }; }, 0 ); } -
I have been using GSAP on a recent web-site development to which I planned on giving a speed boost by applying the latest version of GSAP. I modified my code to support the latest changes in the API, but couldn't get the following code to work anymore. // worked on 1.6.4. // obj is a <img> node fetched with jquery obj[0].currentFrame = 1; var tLine = new TimelineMax({repeat:-1}); tLine.fromTo(obj, animationDuration,{currentFrame:1},{currentFrame:parseInt(fc)+3, onUpdate:animation, onUpdateParams:[obj], ease:Linear.easeNone}); Previously this tween set and changed the currentFrame property accordingly, but 1.8.x doesn't. Did I miss something down the line? Thanks, -Teemu
