Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

Search the Community

Showing results for tags 'canvas'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge

Categories

  • FAQ Landing Page

Categories

  • Examples
  • Showcase

Categories

  • Products
  • Plugins

Categories

  • Learning Center
  • Blog

Categories

  • ScrollTrigger Demos

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Personal Website


Twitter


CodePen


Company Website


Location


Interests

  1. Well, I just wanted to give back a little bit to this great community. I've combined two pieces of code to obtain very easy pixel level collision detection. It may not be "perfect" but it seems fairly accurate. Another post on the forum reference jQuery-Collision plugin, which is really efficient at providing fast rectangular detection. It of course, suffers when your images do not resemble boxes. I found this great little piece of code that does pixel level collision detection on canvas objects. Combining the two gives us a nice two layered approach to first determine if objec
  2. How to animate a sprite images in canvas using GSAP as in this tutorial is shown?
  3. I am trying to create and html5 ad unit using images, canvas and GSAP…I am having a problem seeing it up and loading thin the images…I am trying not to pull in many libraries. Any help would be appreciated. Thanks
  4. Hi i have a question maybe it's simple but maybe not I would like animate a color of canvas shape but i don't understand how in my draw ctx i have this line ctx.fillStyle = colorLogo; colorLogo it's my variable var colorLogo = "rgb(65, 190, 238)"; but with css in tweeMax i don't understand how i have to proceed can you help me ? i have to create a function animate ? Thanks
  5. Hello, I was wondering if it's possible to 3D-Rotate KineticJS objects (shapes). With Tweenmax. If you happen to have some examples please let me know. Thanks.
  6. This is an example that I tailored that uses GSAP to imitate exploding objects. It uses multiple canvases on one element but without the need to re-draw them. I understand this might not be the best solution for large objects but it works nicely with small objects and it is easy to integrate. Please feel free to post your own solutions because honestly I think there is somewhat lack of content in the wild about canvas/DOM explosions... example here: http://cdpn.io/FpiJw (codepen) PS: Feel free to fork and change the explode code (please share here if you do). PS1: Make sure you us
  7. Hello, EDIT: I'm looking for 3D Planes in 3D space, like Flash's native 3D planes and like CSS3 3D transforms. Hard planes rotating & moving in X Y Z. I'm looking for some advice on how I may achieve a 3D Image Flip effect using GSAP JS, in the Canvas. The "cards" will be Bitmaps with transparent areas (PNGs) I intend to re-create this: http://www.westfieldbrochure.com That's a small presentation I crated using GSAP JS but in that case I used CS3 3D transforms. I would like to try it in Canvas now. But I have no idea how to start. If you guys could give me some adv
  8. Is it possible to use the Draggable util class with Canvas, specifically EaselJS? I'm creating a dial that can you can spin using throwprops. I wasnt able to use Draggable so I've recycled the dial AS3 example from here http://www.greensock.com/throwprops/ It works ok, but its a bit glitchy compared with the Draggable CSS example. I've created a Fiddle with the two versions, http://plnkr.co/edit/eKVhZL5ulUWqj5pgP9BA?p=preview Is the something wrong with the math on my Canvas version perhaps? Any tips would be appreciated.
  9. I'm brand new to javascript animation. Can I use this library to tween the drawing of lines (lineTo) on the canvas element? Is there another library out there better suited for that or should I just use plain javascript and requestAnimationFrame ?
  10. 1. unfortunately I see a whole lot of small snippets of code on codepen, but i need to build a full website that i can animate with greensock just like i used to w/ flash but in all of the books i have, csstricks.com is awesome but it doesnt show how to build in conjunction with GSAP. 2. also the other frustration is.. should I build in canvas or use the css dom?... css is smoother canvas has performance issues tho kinetic helps that What information am i missing or not considering. I'm sure its my learning style. I see Kinetic looks good but besides an experiment here or there, i
  11. Hi, i recently tried to combine greensock with createjs/easeljs. I made this: chicken = new createjs.Bitmap('images/chicken.png'); TweenMax.set(chicken, {css:{transformOrigin:"50% 50%"}}); canvas.addChild(chicken); I know that transformOrigin is a css property method, but can i use it for object in canvas? If 'CAN', how do i do it?
  12. Hi everyone, I'm new here so thanks in advance for any communal help I receive. I have a canvas element I'm rotating onMouseMove. Here's the example: http://mikewatt.info/dev/html5_tests/wheel/wheel.html My problem is that 'shortRotation' is not working. Right now I'm using simply 'rotation' because it's working and illustrates the problem area I'm having. If you click the mouse down and drag over the horizontal middle of the circle on the right hemisphere, you'll see the wheel jump 360 degrees to come back to where your mouse is. That's where I need 'shortRotation' but it's not
  13. Hello, I love GreenSock, it's a phenomenal product. I am a Flash Developer migrating to HTML, Canvas, CSS, and Javascript web designing. The Javascript versions are excellent. The one challenge I am having is trying to make the CSS 3D Transformations work. I looked at the demos of how powerful these transformations can be at: http://www.greensock.com/transitions/ http://www.greensock.com/css3/ and the "CssPlugin" section of your documentation at: http://api.greensock.com/js/ But, unfortunately I see a whole lot of small snippets of code (i.e. the trailer for a reall
  14. Hello, I've been working with the Javascript version of GreenSock v 12, EaselJs, and the Canvas element. I know that the Actionscript version of Greensock has a CircluarPath2D or something something like that, but I've searched Google and the Greensock forums and cannot find a way of actual animate the drawing of a shape like in Flash. I've seen tons of examples on "Transforming" shapes, and the drawing of shapes and then put them on the screen, but not any actual on-screen animated drawing of a shape/bezier. I also, looked into svg, but did not see an option there. Is it possibl
×