Jerky (not smooth) transition


(faruk) #1

Dear Hype users,
I have done an animation that the a large picture slowly swipe to right and left.
However the transition is not smooth on some browser with slow connection.
Any idea to fix this? Thanks

http://www.forarestaurants.co.uk/

index.hype.zip (380.8 KB)


(Dennis van Leeuwen) #2

Hello Faruk,

I remember the problem. It’s the slow parts take make the animation feel/look jagged. I would test around and make your own Bézier Curve Timings. It takes time and practice, Faruk. Also try to make an elastic effect on the middle start/middle/end. It could erase the stuttering also.

I’ve added one. It is similar to the standard one. But just a tad difference. Seems to slide better on Chrome.

You can also look on the Internet and see what other are using for curves. A good start is at our friends at Greensock.

Here is your index.html with the Smooth Bézier Curve.
index_smooth.zip (428.7 KB)

Small Question: are you going to set these Widgets to Overflow? It’s weird to see these scrollbars.


(faruk) #3

Hi Bendora,

It was very helpful and thanks for your time.
About your question:
Sorry, I am not sure I understood your question about widgets.


#4

I think @bendora was referring to the ‘content overflow’ setting, which hides scrollbars for elements that have content that extends beyond the element’s border:


(Dennis van Leeuwen) #5

@daniel thinks correct. +1 Like for him.


(faruk) #6

Sorry being late for respond. Thank you both very much for your help. I appreciate :slight_smile: