Tom Boger: Position eines JavaScriptes verändern?

Beitrag lesen

Hallo,

ich hab hier einen Quelltext zu einem Bildlauf im Internet gefunden. Der funktioniert auch soweit nur möchte ich jetzt die Position des Slider selbst bestimmen. Ich hab versucht ein <div> drumherum zu setzen und dann per Css die 'absolute' Position festzulegen. Allerdings funktionierte der Slider dann nicht mehr. Kennt jemand eine Lösung, die die Position des folgenden Codes verändert (absolute Position oder mit margin left/top) ?

Vielen dank schon mal

Hier der Code:

<script type='text/javascript'>
	<!--
        var sliderwidth = 250; // Breite des Sliders
	var sliderheight = 180; // Höhe des Sliders
	var slidespeed = 1; // Geschwindigkeit des Sliders
	var slidebgcolor = "#F0F0F0"; // Hintergrundfarbe
	var leftrightslide = new Array();
	var copyspeed = slidespeed;
	var i = 0;

leftrightslide[i++] = '<a href="0001.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0001.jpg"></a>';
leftrightslide[i++] = '<a href="0004.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0004.jpg"></a>';
leftrightslide[i++] = '<a href="0005.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0005.jpg"></a>';
leftrightslide[i++] = '<a href="0006.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0006.jpg"></a>';
leftrightslide[i++] = '<a href="0010.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0010.jpg"></a>';
leftrightslide[i++] = '<a href="0011.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0011.jpg"></a>';
leftrightslide[i++] = '<a href="0012.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0012.jpg"></a>';
leftrightslide[i++] = '<a href="0013.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0013.jpg"></a>';
leftrightslide[i++] = '<a href="0014.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0014.jpg"></a>';
leftrightslide[i++] = '<a href="0015.html"><img src="http://www.kostenlose-javascripts.de/wp-content/uploads/_files_images_thumbs_0015.jpg"></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);
				}

		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=0" onMouseout="copyspeed=slidespeed">');
							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=0" onMouseout="copyspeed=slidespeed"></layer>');
							document.write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>');
							document.write('</ilayer>');
						}
						document.write('</td></table>');
					}
				}
				//-->
			</script> 

			<script type="text/javascript">
				function addEvent234(obj,type,fn){if(obj.addEventListener){obj.addEventListener(type,fn,false)}else if(obj.attachEvent){obj["e"+type+fn]=fn;obj[type+fn]=function(){obj["e"+type+fn](window.event)};obj.attachEvent("on"+type,obj[type+fn])}};addEvent234(window,'load',fillup);
			</script>