Dynamic-Carousel icon indicating copy to clipboard operation
Dynamic-Carousel copied to clipboard

Feature request - Smoother transitions for iOS devices

Open baoagency opened this issue 13 years ago • 5 comments

When can we expect the smoother transitions between slides to be implemented?

baoagency avatar Sep 19 '12 09:09 baoagency

Perhaps you could fix this with CSS by adding -webkit-transform: translateZ(0); It's worked a treat for me before and it might help.... The general problem is this carousel uses the margin-left property to transition on, but that doesn't have native hardware acceleration on iOS devices, translateZ tricks the browser into thinking you wanna do some crazy shizzle so enables HW acceleration. See http://www.html5rocks.com/en/tutorials/speed/html5/ for more details.

mnapthine avatar Oct 30 '12 19:10 mnapthine

FYI: I can completely see why the margin-left property is being used, another option is translateX but it's percentage model is very different from margin so would require more complicated and buggy JS. I might have a go.

mnapthine avatar Oct 30 '12 19:10 mnapthine

On what element in the styleshet do I place: -webkit-transform: translateZ(0); ??

baoagency avatar Nov 03 '12 14:11 baoagency

Generally on the element you are moving, just try it on the ul. Have a play around with it. As I said it might help but it might not. Post back you findings though as I'd be interested to know how you get on. Good luck!

mnapthine avatar Nov 04 '12 17:11 mnapthine

Well after doing some testing and putting that code on the UL, it seems you can notice the slight change in easing when swiping left to right but its still not a fluid movement unfortunately.

baoagency avatar Nov 05 '12 09:11 baoagency