Diashow mit Überblendeffekt

[Christian]

Hallo zusammen, habe gerade ein ähnliches Problem mit einem Skript. Es geht auch um die Überblendung von Bildern. Das Skript habe ich aus dem Netz, von dieser Seite: http://zeeohemgee.blogspot.com. Ich kann etwas HTML, bin aber absoluter Javaneuling.

Die Blendeffekte werden auf Mac und PC in FF und Opera korrekt dargestellt, nur der IE7 auf PC lässt unten einen Rand des nächsten bildes durchblitzen.
woran kann das liegen? Anbei das Skript: Wär klasse, wenn es nur ein kleiner Fehler wäre, sonst müsste ich ein anderes Skript einbauen.

Besten Dank und viele Grüße
Christian

+++

var fade_pause = 4500; //pause between fades, in milliseconds. 1000 = about one second
var fade_speed = 30;    //fading speed, smaller -> faster
var fade_images = new Array('bilder/jobs1.jpg', 'bilder/jobs1.jpg','bilder/jobs2.jpg','bilder/jobs3.jpg','bilder/jobs4.jpg','bilder/jobs5.jpg');

/*
Don't touch below this line!
-----------------------------------
*/
var aImages = new Array();
var cImage = 0;

//to avoid stupid hassle in getting the IE's
//opacity from a string like alpha(opacity=foo)
//we store it in a separate variable
var ieopacity = 100;

function init()
{
initFading();
}

function preloadFadeImages()
{
 for(var i in fade_images)
 {
  aImages[i] = new Image();
  aImages[i].src = fade_images[i];
 }
}

function initFading()
{
 var bg = document.getElementById('fade');
 var img = document.getElementById('fadeimage');

//execution should stop here if fade and fadeimage
 //dont exist or there's only one image to fade
 if(bg && img && (fade_images.length > 1))
 {
  //preload images
  preloadFadeImages();

//set opacity
  img.style.opacity = 1;
  img.style.filter = 'alpha(opacity=100)'; //for IE

//set image and w and h (IE needs them to be set)
  img.src = aImages[cImage].src;
  img.width = aImages[cImage].width;
  img.height = aImages[cImage].height;

//set background image
  cImage++;
  bg.style.backgroundImage = "url('"+aImages[cImage].src+"')";
  bg.style.width = img.width+"px";
  bg.style.height = img.height+"px";

//start!
  startFading();
 }
}

function startFading()
{
 setTimeout('doFading()',fade_speed);
}

function doFading()
{
 var d = document.getElementById('fade');
 var di = document.getElementById('fadeimage');

//check if the image is already invisible
 if(di.style.opacity != 0 && ieopacity != 0) {
  di.style.opacity -= .01;
  ieopacity--;
  di.style.filter = 'alpha(opacity='+ieopacity+')';

//continue fading
  startFading();
 }
 else {
  //the image is invisible, should change to next image

cImage++;
  if(cImage == aImages.length) {
   cImage = 0;
  }
  di.src = getImageFromCSS(d.style.backgroundImage);
  d.style.backgroundImage = "url('"+aImages[cImage].src+"')";
  di.style.opacity = 1;
  ieopacity = 100;
  di.style.filter = 'alpha(opacity='+ieopacity+')';
  setTimeout('startFading()',fade_pause);
 }

//this *should* reduce memory leaks in IE?
 d = null;
 di = null;
}

/*
 Gets the url from a string like
 url("here_is_an_url")
 or without quotes (because IE = fail)
 */
function getImageFromCSS(cssurl)
{
 if(cssurl.indexOf('"') != -1)
  return cssurl.substring((cssurl.indexOf('"')+1),cssurl.lastIndexOf('"'));
 else
  return cssurl.substring((cssurl.indexOf('(')+1),cssurl.lastIndexOf(')'));
}