Why image opacity animation runs smooth in Firefox and Chrome but not Safari?

I have a few sibling images that are absolutely positioned at top:0 and lef开发者_StackOverflowt:0 relative to their parent div. By default, the last image is on top. I am using jQuery to fade the images one at a time by animating to opacity:0 starting with the upper most image "the last image in the parent div". For some reason the animation looks smooth in firefox and chrome, but not safari? What are some reasons why this might be happening? Thanks in advance.

Are you sure it is the animations fault? I have had a case where using box-shadow:inset... and -webkit-box-shadow:inset... caused safari to lag. If you CAN isolate it to jQuery, then I'm not sure what's going on. Do you use cycle?

I don't know off hand how jQuery handles opacity in Safari. If it's not using the webkit CSS properties, then that could be the reason. The webkit CSS properties for opacity are going to perform better.