imageflow animation looks bad on IE with opacity=false

Question

I've been trying to install imageFlow in a site. It works fine except in IE (8 in mycase). The problem is that the animation isn't smooth. I've looked at their demo in IE8 and it works great. I can't for the life of me understand why my example isn't working and theirs does. I"ve tried changing the options of imageFlow based on the examples but to no avail.

Here's the code I'm using:

<div id="carousel" class="imageflow" style="border:solid 1px;height:292px;width:971px;background-image:url('images/carousel/carouselBackground.jpg');"> 
<img src="path1.jpg" longdesc="" width="666" height="500" alt="1" />
<img src="path2.jpg" longdesc="" width="666" height="500" alt="2" />
<img src="path3.jpg" longdesc="" width="666" height="500" alt="3" />
<img src="path4.jpg" longdesc="" width="666" height="500" alt="4" />
<img src="path5.jpg" longdesc="" width="666" height="500" alt="5" />
</div>

<script>
domReady(function()
{
var instanceOne = new ImageFlow();
instanceOne.init({ ImageFlowID: 'carousel',
                    reflections: false,
        slider: true,
                    reflectionP: 0.2,
        aspectRatio: 3.32,
        imagesHeight: 0.7,
                    captions: false,
                    opacity: false,
                    xStep: 150,
        buttons: true,
        imageFocusM: 1.0,
                    startID: 3 });
});
</script>

When I change opacity to true, the broken animation is fixed for some reason.

Answer 1

I have exactly the same issue. A workaround I found was to enable opacity, then simply set all images be completely opaque, like so:

 opacity: true, opacityArray: [10,10,10,10,10]