• Content count

  • Joined

  • Last visited

Community Reputation

13 Newbie

About Yashi-2

  • Rank

Profile Information

  • Location
    Colombo, Sri lanka

Recent Profile Visitors

438 profile views
  1. Yashi-2

    ScrollMagic GSAP SVG Mask Bug

    I've experienced the same issue you have right now. but it only happens when I create SVG in HTML document. (Like copy paste SVG from illustrator or svgomg, and also coding SVG data by hand without concerning browser compatibility ) I know its kind of wired. but to solve my problem I used SnapSVG plugin to create and animate SVG element with GSAP. specially masking and clipping related animations. and it can handle browser compatibility pretty well. but like @Carl sed before try to avoid <defs> data animation as much as possible. this might not be the correct solution but I suggest you to give it a try and see. but for me, the SnapSVG plugin work well with every desktop and mobile browsers.
  2. hi, @Sahil can't wait to see more from you. awesome initiative and any support from me. keep up with your good work. and thanks
  3. Yashi-2

    Correct Syntax to remove multiple classes

    thanks, @Sahil @Jonathan and @Carl to clear this out. I was struggling to do this with a single tween. I think it involves two tweens. but this makes sense now. big thanks to @Carl .. :)
  4. Yashi-2

    Correct Syntax to remove multiple classes

    yes sure and thanks, @Jonathan. for GS I think this is must have but without any order to remove multiple classes. like how JQ and native-js handle this thing
  5. Yashi-2

    Correct Syntax to remove multiple classes

    @Sahil correct and also order doesn't matter. but if you can avoid jquery try to use @OSUblake native javascript solution. it's the correct way.
  6. Yashi-2

    Correct Syntax to remove multiple classes

    Thanks, @OSUblake.
  7. Yashi-2

    Correct Syntax to remove multiple classes

    it's ok now. I did that with jquery. Jquery can handle multi-class removals. and it doesn't require order. it just removes them. thanks @Sahil
  8. Yashi-2

    Correct Syntax to remove multiple classes

    yup that is my main issue. the order of the class names. what if I use double className attribute. it's an antipattern. will that be ok?
  9. Hi, this is a noob question. I want to remove multiple classes at once. how do I do it, is this right? if not what is the correct syntax tl.to(elem, 0.3,{className:"-=open,white"});
  10. Awesome @OSUblake is a superb guy... this is what I want.. thanks, @Sahil @OSUblake
  11. hi, @Sahil thanks for your feedback. and yes I know that method. but I want to clear all the timeline elements like $nameSplit.chars, $descSplit.chars so on. without specifying individual onComplete callback and onCompleteParams with clearProps. I want global onComplete to clearProp all the elements. is it possible to do? if you have time, can you show me how to do it simply?
  12. Hi, I want to know how to clear all the animated properties from TimelineMax at once. not individual. like onComplete clearProp all or something like that and all the nested elements also. is there a way to use wildcard selector? ex: var tl = new TimelineMax({id:"sliderOut", autoRemoveChildren:true, onComplete:function(){ // i want to clear all the animated values and properties at once not individual }}); tl .staggerTo($nameSplit.chars, 0.4, {y:'-10', autoAlpha:0, ease:Power4.easeInOut},0.05,"+=0") .staggerTo($descSplit.words, 0.4, {y:'-10', autoAlpha:0, ease:Power4.easeInOut},0.05,"-=0.5") .staggerTo($techSplit.lines, 0.4, {x:'10', autoAlpha:0, ease:Power4.easeInOut},0.05,"-=0.5") .to($slide_img, 1, {yPercent:'10', autoAlpha:0, ease:Power4.easeOut},"-=0.5") .to($slide_left_svg_bg, 1.5, {x:'20%', autoAlpha:0, ease:Back.easeInOut},"-=0.5") .to($slide_right_svg_bg, 1.5, {x:'-20%', autoAlpha:0, ease:Back.easeInOut},"-=1.5") .staggerTo($staticTitleSplit.chars, 0.5, {y:'20', autoAlpha:0, ease:Back.easeOut},0.03,"-=1.5") .staggerTo($numSplit.chars, 0.5, {y:'20', autoAlpha:0, ease:Back.easeOut},0.03,"-=1.5") .to($left_out_bg, 0.5, {x:'100%', ease:Power4.easeOut},"-=0.5") .to($right_out_bg, 0.5, {x:'-100%', ease:Power4.easeOut},"-=0.5");
  13. Yashi-2

    GSDevTools Not picking up my IDs

    Thanks, @Carl . now it's all good.. super cool and super useful tool.. awesome. love it. lot of time-saving and fine-tuning has never been easier like this
  14. Yashi-2

    GSDevTools Not picking up my IDs

    ok, I'll post a demo. one thing I've noticed. if my timeline is inside a function. I cant access to that timeline from outside. right? I think that's the problem. my timeline is inside a gotoNext function so GSDevTools cant access to that timeline. I guess.
  15. Yashi-2

    GSDevTools Not picking up my IDs

    Hi, @mikel thanks for your feedback. I did that. but that also didn't work. I don't know whats happening. I can only see Global Timeline, cant pick my tween id. it's not showing up