Jump to content


  • Posts

  • Joined

  • Last visited


26 Newbie

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. jimeast

    GSAP over canvas

  2. jimeast

    GSAP over canvas

    I have a canvas parallax animation that I copied from an example in a Canvas text book. I also have a GS animation which I copied from from a GS book. I put GS animation over the canvas ant it works fine. My problem is I can't seem to find a way to mask it off so that you only see the car when it's over the canvas. Thanks in advance. Jim E.
  3. I don't recall I used to study GS years ago. I think some of the examples I saw in books must have used Jquery.
  4. So GSAP doesn't use jquery internally?
  5. Is there a version of GSAP that doesn't require Jquery?
  6. I have a fairly extensive and up to date knowledge of JS and jquery. I read that react is a good match for GSAP. I set out to learn react a few days ago and the deeper I get into it the more complex it gets. I want to use GSAP to make simple banner ads. Might being proficient in REACT be overkill?
  7. json is real simple and easy to learn. Just go to udemy, search for json https://www.udemy.com/courses/search/?src=ukw&q=json
  8. OMG!! I need a brain transplant a.s.a.p! lol THANKS!!
  9. Great!! This works on codepen now if I can get it to work elsewhere. This is the entire code just so we know I'm not missing something. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Eat More Chowder</title> <style> body { background-color: #ccc; } </style> </head> <body> <div id="text1">Eat</div> <script https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.2/TweenLite.min.js></script> <script https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.2/plugins/TextPlugin.min.js></script> <script> var txt = document.getElementById("text1"); TweenLite.to(txt, 2, {text:"New text here"}); console.log(txt); </script> </body> </html> Every time I run I get this error: Uncaught ReferenceError: TweenLite is not defined at eatMore.html:24 What am I doing wrong?
  10. If you're a paid member you can just click on your assets button and drop it in (provided it's not too large).
  11. It's about the simplest example possible and it's got me stumped. When I run at home I always get a "TweenLite is not defined" error. This is copied from my editor at home. <body> <div id="text1">Eat</div> <script https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.2/TweenLite.min.js></script> <script> var txt = document.getElementById("text1").innerText; TweenLite.to(txt, 2, {text:"New text here"}); console.log(txt); </script> </body>
  12. Ok now I know why it was only working for me on codepen. I made my versions of jquery and gsap match what Blake was using now the problem's gone. Ya!!! Thank You so much!!
  13. I changed to visibility: inherit but that just makes the word three disappear. Maybe I should remove the text from the html and add it all in the script? Or maybe I should change the css from hidden to visible in the script as soon as it loads.
  14. The problem doesn't show up in code pen only when run from my hosted site. Here's the site where the problem appears. http://jimslounge.com/Three/