fadeIn / fadeOut performance problem
I am working on a solution which just fades in and out between different images. Since the solution needs to be dynamic (the images are scaled according to the window size), I am running in to problems. Whenever the images measurements are modified on window scaling by javascript, the fades are starting to jump/flicker, not running smoothly at all. jQuery is used to edit CSS properties (width/height) of the images. Also tried to edit img tag width and height attributes instead of CSS, but the problem still remains.
To make sure that other parts of the app are not causing it I created a plain HTML test site, where I had an image which measurements were modified with external CSS / inline CSS and also img tag attributes, still ran into the same thing. On a bit quicker machines, the problem occurs only if the image is scaled up above its original measurements, but for example on a dual core 1.8ghz older machine the fades broke even when scaling the image down from its original measurements.
Has anybody any ideas what could be the cause and how to create a workaround?