obidan: JS-Slider zeigt Lücke bei Übergang

Beitrag lesen

Hallo Forum,

habe einen Bildslider in Javascript, der auch so weit funktioniert. Nur folgendes Phänomen: Wenn das Bild (oder die Bilder, ist egal ob es nur ein großes oder mehrere einzelne sind) sich wiederholt, bleibt eine kleine Lücke. Diese lässt beim zweiten Schleifendurchlauf nach und ist beim dritten verschwunden. Ich finde meinen Fehler einfach nicht, hat jemand einen Tipp?

zu sehen unter jstest

Der JS-Code:

  
// JavaScript Document  
  
var sliderwidth = 1000;  
var sliderheight = 145;  
var slidespeed = 3;  
var slidebgcolor = "#FFFFFF";  
var leftrightslide = new Array();  
var copyspeed = slidespeed;  
var i = 0;  
  
leftrightslide[i++] = '<a href="0001.html"><img src="Bilder/nojs_leiste.jpg" border="0" height="150"></a>';  
  
leftrightslide = '<nobr>' + leftrightslide.join("") + '</nobr>';  
var iedom = document.all || document.getElementById;  
if (iedom)  
 document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-3000px">' + leftrightslide + '</span>');  
 var actualwidth = '';  
 var cross_slide, ns_slide;  
  
function fillup(){  
  if (iedom){  
        cross_slide=document.getElementById? document.getElementById("test2") : document.all.test2;  
        cross_slide2=document.getElementById? document.getElementById("test3") : document.all.test3;  
        cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide;  
        actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp").offsetWidth;  
        cross_slide2.style.left=actualwidth+20+"px";  
      }  
  else if (document.layers){  
        ns_slide=document.ns_slidemenu.document.ns_slidemenu2;  
        ns_slide2=document.ns_slidemenu.document.ns_slidemenu3;  
        ns_slide.document.write(leftrightslide);  
        ns_slide.document.close();  
        actualwidth=ns_slide.document.width;  
        ns_slide2.left=actualwidth+20;  
        ns_slide2.document.write(leftrightslide);  
        ns_slide2.document.close();  
      }  
      lefttime=setInterval("slideleft()",30);  
    }  
    window.onload=fillup;  
  
    function slideleft(){  
      if (iedom){  
        if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))  
          cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px";  
        else  
          cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+"px";  
  
        if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))  
          cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px";  
        else  
          cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+"px";  
      }  
      else if (document.layers){  
        if (ns_slide.left>(actualwidth*(-1)+8))  
          ns_slide.left-=copyspeed;  
        else  
          ns_slide.left=ns_slide2.left+actualwidth;  
  
        if (ns_slide2.left>(actualwidth*(-1)+8))  
          ns_slide2.left-=copyspeed;  
        else  
          ns_slide2.left=ns_slide.left+actualwidth;  
      }  
    }  
  
    if (iedom||document.layers){  
      with (document){  
        document.write('<table border="0" cellspacing="0" cellpadding="0"><td>');  
        if (iedom){  
          document.write('<div style="position:relative;width:' + sliderwidth + 'px;height:' + sliderheight + 'px;overflow:hidden">');  
          document.write('<div style="position:absolute;width:' + sliderwidth + 'px;height:' + sliderheight + 'px;background-color:' + slidebgcolor + '" onMouseover="copyspeed=3" onMouseout="copyspeed=3">');  
          document.write('<div id="test2" style="position:absolute;left:0;top:0"></div>');  
          document.write('<div id="test3" style="position:absolute;left:-1000;top:0"></div>');  
          document.write('</div></div>');  
        }  
        else if (document.layers){  
          document.write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>');  
          document.write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=3" onMouseout="copyspeed=3"></layer>');  
          document.write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=3" onMouseout="copyspeed=3"></layer>');  
          document.write('</ilayer>');  
        }  
        document.write('</td></table>');  
      }  
    }