Hi there
I’m super new, so I’m sorry if this has been asked before. I have made a short looping image sequence, but in Safari and Chrome browsers there is a slight pause at the end of the timeline. Does anyone know why this happens, and if there is a way to alleviate this? Click here for the export - http://narrativemedia.co.za/test/hypetest/Export.html
Thanks
Dominica
The pause for me happens when the page is maximized, but not when the page is smaller. This, and the fact that my processor starts spinning like nuts leads me to think that it has to do with the size of the images – it’s a lot of image content to quickly switch between. Can you share your original so I can see if this can be optimized?
Hey Daniel, thanks for your response. Here is the open file & images - not sure if you need anything else?
https://drive.google.com/file/d/0B3sdgvsMXU8sbll3bGlTTmRScU0/view
Dominica
I think a big part of it is the size of the images. One thing I tried was changing how the images load at time 0: instead of all 23 images at once, I set display:visible closer to where the images are actually used:
I’ve put it up here: https://2give.s3.amazonaws.com/temp/2017/screen4.html
This made it slightly smoother, but still not perfect.
Can you get the images and scene size down closer to about 900 pixels wide max?
Hey Daniel, it makes sense that staggering load time helps. Unfortunately I can’t change the size of the images. But staggering them improves it a lot, so I will do this in future.
Thank you for your help!
Dominica
Personally I would try to see if I could break the image up as only a little part actually moves. Animate that and let 3 pics be static.
Like this perhaps?
Hi Rick, thanks for you advice.
Unfortunately i’m not sure what you mean by breaking the image up? How would i go about this?
Thank you
Dominica
I just realize it could be much easier. 
All you need is the mid bottom part(s) (as in my example) where the water drips out and 1 background.
So with an image editing program like Affinity I would crop the part out that contains the moving parts.
To do so, I would load all images into separate layers, define the cropping area, crop so all you have left is the parts that have movement then save each frame. Go into Hype, load one un-cropped image as background then load the cropped images above the background into a new timeline and position them so they line up with the background.
Using @Rick4F idea …
screen4_MH1.hypetemplate.zip (2.1 MB)
I did have to disable the flexible layouts. But you may be able to fix that…
