Im relatively new to Hype, and wanted to ask if there is a way to control when a gif starts and stops?
To put it more into context:
I have an animation that loops once, and then holds on an endframe, and i have an element that is this ‘drawn line’ graphic (and since Hype doesnt have any drawing features, ive had to create it in After Effects, then export to Photoshop, then export as a gif. If anyone knows how to do line drawing animation in hype or an easier way, im all ears!)… so back to my timeline, ive imported the gif into my resources, and when i drag it onto the scene, it just begins playing (without me pressing play, which i understand as its a gif) and when i preview it in browser, it plays but… when the timeline loops it doesnt activate the gif again on the repeat.
I was wondering if there’s something im doing wrong? or if i need to trigger the gif to run again on the repeat? im just a bit confused, and any help or knowledge would be greatly appreciated.
Unfortunately, animated GIFs either loop or play just once and always start when loaded into the DOM.
You can fake a start on user interaction by changing the src from a static image to the animated gif or simply assign the same gif to the src attribute which I think would be the case for you.
So at the beginning of your timeline you could create a function as a timeline action and just load the animated gif as the source, like:
image = hypeDocument.getElementById('img1'); // global variable to use in other functions if needed
image.src = "http://1.bp.blogspot.com/-9JGP6dMSjaM/V9zvXY6xLZI/AAAAAAAACwA/OG6pMKgBymgDg5myD9PgV9pST1UdEn8ewCK4B/s1600/quickfever_animated_logo-resize-compressor.gif#quickfever_GIF_logo";
to the innerHTML. The reason for this is so that there is no border on the element at the beginning. blank.gif is also automatically added by hype so no need to create one.
You would then run an action at the end of your timeline to loop the timeline. Or use another action to run a function that assigns the image.src attribute.
