Jump to content
GreenSock

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

Search the Community

Showing results for tags 'frame by frame'.



More search options

  • 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

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


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests

Found 2 results

  1. Hi guys, I am looking into building an adverting system that would use GS at it's core. I am going to use bottom end android tables as display units and I currently find that animations are jerking due to the low spec CPUs. I know that there is some GPU support in CSS3 but I am not sure how practical or applicable this is to the mobile platform. Having said that I know that most of these low spec tablets do have quite good GPU's for video playback up to 1080p 30fps and I am only looking for 720p 30-60fps. So what I am looking to do is use the 'save to image' function of canvas and either post to the server or use something like PhantomJS in Node to render the frames to a folder then use ffmpeg to stitch them into mp4s at the desired frame rate. This would also allow a host of other effect to be applied programmatically. I know that GS plays nice with KineticJS for canvas rendering and I have altered the codepen example (http://codepen.io/GreenSock/pen/xaDAG) to use the tick event listener as a test. I am however worried that this is not synchronous and would not post to the server fast enough to capture all the frames if run clientside. Should I rather use seek to jump a frame forward at a time and then render the canvas out. Does seek work with the KineticJS plugin? Many thanks in advance, any other approaches welcome.
  2. Hi there guys! can you please help me I am struggling how to code the animation for it properly with my 4 separated frames images. I want to animate it smoothly and nicely like normal cyclist. Here's my code for animating 4 framed images. JavaScript: window.onload = init; function init() { TweenMax.set("#two, #three, #four", {alpha: 0}); animationOne(); } function animationOne() { TweenMax.to("#one", 0, {alpha: 0, delay: 1}); TweenMax.to("#two", 0, {alpha: 1, delay: 1}); TweenMax.to("#two", 0, {alpha: 0, delay: 1.1}); TweenMax.to("#three", 0, {alpha: 1, delay: 1.1}); TweenMax.to("#three", 0, {alpha: 0, delay: 1.2}); TweenMax.to("#four", 0, {alpha: 1, delay: 1.2}); TweenMax.set("#one", {alpha: 1, delay: 1.3}); TweenMax.set("#two, #three, #four", {alpha: 0, delay: 1.3, onComplete: animationTwo}); } function animationTwo() { TweenMax.to("#one", 0, {alpha: 0, delay: 1}); TweenMax.to("#two", 0, {alpha: 1, delay: 1}); TweenMax.to("#two", 0, {alpha: 0, delay: 1.1}); TweenMax.to("#three", 0, {alpha: 1, delay: 1.1}); TweenMax.to("#three", 0, {alpha: 0, delay: 1.2}); TweenMax.to("#four", 0, {alpha: 1, delay: 1.2}); } HTML: <div id="cyclist"> <img id="one" src="https://s32.postimg.org/inysw8m2d/wiggins_01.png"/> <img id="two" src="https://s32.postimg.org/ip8qpnnw5/wiggins_02.png"/> <img id="three" src="https://s32.postimg.org/c0279n2k5/wiggins_03.png"/> <img id="four" src="https://s32.postimg.org/j4k0io9th/wiggins_04.png"/> </div> CSS: img { position: absolute; left: 10px; top: 10px; bottom: 0; right: 0; } For full editing please go here: http://codepen.io/Waren_Gonzaga/pen/PzEzag Kindly fork my pen and please revise. It really helps me to figure out how to make a code for this animation.
×