benbarnett / jquery-animate-enhanced

Extend $.animate() to detect CSS transitions for Webkit, Mozilla, IE>=10 and Opera and convert animations automatically.
http://playground.benbarnett.net/jquery-animate-enhanced/
MIT License
1.38k stars 197 forks source link

Looking HTML during translate3d don't change translate3d(myX px, 0px, 0px) properties, but left property #89

Closed jffortierqc closed 12 years ago

jffortierqc commented 12 years ago

When I look into the HTML while the transition is running (safari - Web Inspector), I see the left property increase, but the translate3d properties don't change. I did that test because on my iPhone I don't see difference using the plugin or not. When I manually change the CSS property of my HTML object calling the -webkit-transform: translate3d(0px, 0px, 0px); CSS then I can see the difference.

This plugin is what I need to do a transition I'm pretty sure. But seams that I can see how to make it works, or what what is the problem. Note : yes the file is well implemented, I can do console.log() to trace some plugin infos.

Any idea

runey71 commented 12 years ago

I noticed the same problem. No hardware acceleration on iOS devices. Setting useTranslate3d did the trick for me.

$(".target").animate({left: '+=260', useTranslate3d:true}, 1500, function() { //Do something });

benbarnett commented 12 years ago

Thanks @runey71