Jump to content
Search Community

WarenGonzaga

Members

  • Posts

    127

  • Joined

  • Last visited

 Content Type 

Everything posted by WarenGonzaga

3
4
5
Page 4 of 6  
  1. WarenGonzaga
    Hello Dr. Fingerless! I dont have idea how could you make a post without fingers? LOL Anyway we required here to post your codepen so anyone could understand your problem! Welcome to the forum! Nice shot Jonathan
  2. WarenGonzaga
    Hello everybody! I am introducing my effort to clone/mimic the reusable animation from animate.css into greensock version. I am inviting everyone here to contribute to the project I've started on Github! First I would like to thank to the founders and administrators who helped me to understand the difference between animate.css and gsap in terms of animation. GreenSock is the one who has flexible building blocks to create amazing web animation. So yeah! Here we go I am now every masters and new user to contribute to my unofficial plugin! You can find the repo links and demo below! DEMO: http://warengonzaga.github.io/sites/animatecssplugin.html (Underdevelopment) GITHUB REPO: https://github.com/WarenGonzaga/AnimateCSSPlugin (Contribute Today!) OFFICIAL GROUP CHAT: https://tlk.io/animatecssplugin/ OFFICIAL BLOG: http://warengonzaga.com/blog/2016/09/20/animatecssplugin-js-gsap/ (Dead Link wait for further updates) ORIGINAL TOPIC: http://greensock.com/forums/topic/15082-best-way-to-use-gsap-with-animatecss/ Calling for @jonathan, @carl, and also @jack they are the GSAP Legends! Best Regards, Waren Gonzaga
  3. WarenGonzaga
    Good Job Jonathan!
  4. WarenGonzaga
    Thank you Carl! I really appreciate and it is clear to me now! I am really want to improve GSAP thanks for the help!
  5. WarenGonzaga
    Hey buddy! even you clip it the problem is there! He trying to fit the image from outside overflow into inside overflow of circle which is not good idea (for me) try to crop your image in same size of your circle. That's only my suggestion. Let's wait for GSAP legends to find the better solution to your awesome question!
  6. WarenGonzaga
    Hey buddy you're awesome! Thanks for help it works!
  7. WarenGonzaga
    Hello buddy! I am trying to find solution for your experience. I noticed that you are tweening hand from outside of circle to inside??? I think that's weird idea. It will be render from outside of to inside of your circle. Try to cut the image in the same size of your circle so there will be no issue like that. I try to clip this but it doesn't work. Thanks!
  8. WarenGonzaga
    Hey guys please please help to understand THIS on javascript. I am trying to use THIS to select the same selector from parent function. Here's example: function Animate() { console.log("Clicked!"); TweenMax.to("#thing", 1, {onStart: a}); } function a() { console.log("Yeah!"); TweenMax.to(this, 1, {y: "100px"}); } I know this is clever but I want to know how to select the same selector from parent function. Same as THIS.
  9. WarenGonzaga
    Hello Martya! Thanks! Actually I have my own banner boilerplate for banner making for the fastest as I can. This is looks like on the workflow of Oliver25Years which has complete resources for all banner type and I love that. Because my banner boilerplate is build for DoubleClick studio and DCM only so this is great Idea may be I will put that on Github but I need permission from Oliver25Years for his awesome codes!
  10. WarenGonzaga

    New feature

    WarenGonzaga replied to TRFC's topic in GSAP

    I think you need help from @carl or @jonathan. Or you can talk with @jack the greensock father! I am confuse on what you are trying to do anyway! Thanks for your post! Welcome to GSAP forum!
  11. WarenGonzaga
    Thank you for your support buddy! Again here's the finalized solution! You can use this CDN from google! <script src="https://s0.2mdn.net/ads/studio/cached_libs/tweenmax_1.19.0_643d6911392a3398cb1607993edabfa7_min.js"></script> Then if you prefer to use TweenLite there you go! <script src="https://s0.2mdn.net/ads/studio/cached_libs/tweenlite_1.19.0_422f021fad4c20f20cf3640a06ac39e9_min.js"></script> <script src="https://s0.2mdn.net/ads/studio/cached_libs/cssplugin_1.19.0_cfbff7d208ccfdbe176b9855af1eb1fa_min.js"></script> <script src="https://s0.2mdn.net/ads/studio/cached_libs/easepack_1.19.0_be87087c08fcec83e2b64c70571fe91f_min.js"></script> I hope this is clear now! For more info go here: http://greensock.com/forums/topic/12701-google-doubleclick-hosts-gsap-on-their-cdn/ For more Google CDN version of GSAP kindly visit this link: https://support.google.com/richmedia/answer/6307288 Don't forget to hit like button! Thanks all!
  12. WarenGonzaga
    It is better to make your own tool for viewing banners of yours based on my opinion.
  13. WarenGonzaga
    @carl If I follow all the requirements and qualification for the plugin is it possible to be part of official plugin of GSAP? Is there qualification or requirements?
  14. WarenGonzaga
    @Carl! Thanks for your awesome reply! I really appreciate it! Thanks! found the right way to make plugin for re-usable effects! You can help me to improve this plugin idea!
  15. WarenGonzaga
    You can put it on Github so we can fork it and contribute buddy! Would be great idea!
  16. WarenGonzaga
    Hey man! This is what I needed!!! Thanks for this! may I improve this great stuff?
  17. WarenGonzaga
    Hello guys! Thanks for the answer Jonathan! Stay awesome dude! I will help you to explain your answer. Your codepen has no external javascript links (CDN version of GSAP's TweenMax and Jquery) Here's the step by step pictures! There you go buddy! I hope it helps!
  18. WarenGonzaga
    Hello everyone here! I am planning to make custom free unofficial plugin for GSAP (it would be nice to make official plugin). But my only problem is where do I start? There's no documentation on how to make own/custom plugin for GSAP. I would like to make some free custom plugin for GSAP for the purpose to extend the abilities and powers of GSAP. I already create a repo for my plugin project for GSAP and I am inviting you guys to contribute! Any suggestions would be great! Calling for @Jack, @Carl and @Jonathan (They are GSAP legends) Github Repository: https://github.com/WarenGonzaga/AnimateCSSPlugin Best Regards, Waren
  19. WarenGonzaga
    Anyway guys! As you said that choose one library. So I decided to start a project for GSAP - animate.css project that will improvise their animation. I will need your help guys for creating this plugin. @Carl do you have documentation on how to make plugin with gsap? I will make now github repo for this plugin so we can collaborate with improvising the animate.css animations into gsap version. Anyway thanks for helping me and I really appreciate your opinions and help! I will post the github repo for improvising animate.css. Have a great day buddies!
  20. WarenGonzaga
    This is great as snippet for using animate.css with gsap!
  21. WarenGonzaga
    I would suggest to use CDN version of TweenMax or TweenLite. Here's the CDN for Robust version (TweenMax) <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.0/TweenMax.min.js"></script> Here's the CDN for Lightweight version (TweenLite) <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.0/plugins/CSSPlugin.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.0/easing/EasePack.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.19.0/TweenLite.min.js"></script> For comparison about TweenMax and TweenLite there's no difference in performance they are good to use the only difference is that their size here's the great answer from Carl! Link: http://greensock.com/forums/topic/10136-difference-between-tweenmax-tweenlite-based-on-gc-speed/
  22. WarenGonzaga
    Welcome to GSAP Forum buddy! Here's my solution to your awesome post! Your GSAP codes are looks good! Just add background-attachment: fixed; on your .twinkle selector! .twinkle { @extend .scene; background-attachment: fixed; background-image: url("http://www.script-tutorials.com/demos/360/images/twinkling.png"); background-repeat: repeat; background-position: center; background-color: green; z-index:1; } Here's the codepen demo! http://codepen.io/Waren_Gonzaga/pen/dprdxB
  23. WarenGonzaga
    Very inspirational! Awesome animation buddy!
  24. WarenGonzaga
    Hey buddy! Exactly! I will elaborate my question! I have recently banner project which is rely on animate.css properties such as bounceIn and rubberBand animation. That's the animation I can't improvise using gsap. Can we made plugin for animation from animate.css? You can read the github repo here! https://github.com/daneden/animate.css
  25. WarenGonzaga
    Hey buddy! You can add this single line of code! JavaScript: function anima(){ var tween1 = TweenLite.from(".bg1", 0.8, {opacity:0, delay:0.5}); var tween2 = TweenLite.from(".bg2", 0.5, {opacity:0, scaleX:1.3, scaleY:1.3, delay:2.9, ease: Back.easeOut.config(3)}); var tween3 = TweenLite.from(".bg3", 1, {opacity:0,y:-25,delay:3.4}); var tween4 = TweenLite.from(".blanco", 1, {opacity:0, delay:5.5}); var tween5 = TweenLite.from(".text1", 1, {opacity:0, delay:6}); var tween6 = TweenLite.from(".btn", 0.5, {opacity:0, scaleX:1.2, scaleY:1.2, delay:6.5, ease: Back.easeOut.config(3)}); //This will reset the ad TweenLite.delayedCall(5, anima); //delayedCall(seconds, callback function } CODEPEN LINK --> http://codepen.io/Waren_Gonzaga/pen/pEgdVG Read the documentation: https://www.greensock.com/asdocs/com/greensock/TweenLite.html
3
4
5
Page 4 of 6  
×
×
  • Create New...