[GELÖST] [JS] 2 onload-funktionen gleichzeitig gehen nicht

Sn0w1 · 10. Juni 2012

[GELÖST] [JS] 2 onload-funktionen gleichzeitig gehen nicht

Hallo zusammen, inzwischen sitze ich seit guten 5 STunden hier an dem Problem und wenn ich ehrlich bin habe ichd afür absolut keine Zeit :S

Ich habe wie oben beschrieben 2 Scripte die via onload ausgeführt werden. Zumindest vermute ich das.. Ich hab in dem html code jetzt folgendes:

HTML:

<body onload="start();">

    <div id="lieferantenband">
       <script type='text/javascript' src="js/lieferantenband.js" >
       </script>
    </div>

<div id="main">
   <img id="image" src="http://extreme.pcgameshardware.de/images/slideshow/aussen/aussen_2.jpg" width="500" height="300" />
    <script type="text/javascript" src="js/slideshow.js">
    </script>
</div>

</body>

Nun sehen die Scripts an sich wie folgt aus:

lieferantenband.js:

Code:

var sliderwidth = 1000;
var sliderheight = 80;
var slidespeed = 1;
var slidebgcolor = "";
var leftrightslide = new Array();
var copyspeed = slidespeed;
var i = 0;

leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/maselli.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/khujo.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/joker.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/mens.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/olymp.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/pioneer.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/s_oliver.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/scotch_soda.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/timezone.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/casa_moda.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/digel.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/eurex.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/jockey.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/gin_tonic.png">';
leftrightslide[i++] = '<img src="http://extreme.pcgameshardware.de/images/lieferantenband/falke.png">';


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("slideright()",30);
}
window.onload=fillup;

function slideright(){
    if (iedom){
        if (parseInt(cross_slide.style.left)<(actualwidth+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+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+8))
            ns_slide.left+=copyspeed;
        else
            ns_slide.left=ns_slide2.left-actualwidth;

        if (ns_slide2.left<(actualwidth+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>');
    }
}

Für den wurde keine onload vorgegeben im html. Dieser javascript läuft am Ende auch wenn der zweite drin ist. (Alleien übrigens auch).

slideshow.js:

Code:

    var images = new Array(
        ["http://extreme.pcgameshardware.de/images/slideshow/aussen/aussen_2.jpg", "Aussenansicht 1", "Aussenansicht 1"],
        ["http://extreme.pcgameshardware.de/images/slideshow/aussen/aussen_3.jpg", "Aussenansicht 2", "Aussenansicht 2"],
        ["http://extreme.pcgameshardware.de/images/slideshow/innen/innen_1.jpg", "Innenansicht 1", "Innenansicht 1"],
        ["http://extreme.pcgameshardware.de/images/slideshow/innen/innen_2.jpg", "Innenansicht 2", "Innenansicht 2"],
        ["http://extreme.pcgameshardware.de/images/slideshow/innen/innen_4.jpg", "Innenansicht 3", "Innenansicht 3"] );

var counter = 0;

function start() {
    var image = document.getElementById('image');
    image.setAttribute('src', images[counter % (images.length)][0]);
    image.setAttribute('alt', images[counter % (images.length)][1]);
    image.setAttribute('title', images[counter % (images.length)][2]);
    counter++;
    setTimeout("start()", 4500);
}

Dieser läuft NICHT mit dem anderen zusammen, alleine allerdings schon. Dieser wurde mit onload festgelegt.

So nun meine Frage, wie bekomme ich es hin das beide gleichzeitig laufen?!
Oder ließe sich die Slideshow auch mit php o.ä. realisieren, hierbei zu beachten wäre Frage nummer2:

Kann ich es hinbekommen das die übergänge fließend sind wie z.b. bei dem Bild inner Mitte auf: NYC template

Greetz und bitte um schnelle Antwort,
Sn0w1

MaNT1S · 11. Juni 2012

AW: [DRINGEND] [JS] 2 onload-funktionen gleichzeitig gehen nicht

der 2. kann ja auch nicht laufen, da das Script nirgends gestartet wird?
schreib mal am Ende noch folgendes hin:

....
counter++;
setTimeout("start()", 4500);
}

start(); // <- Startet die Funktion

den Rest hab ich mir jetzt nicht genau angeschaut..... aber wenns einzeln läuft, wirds wohl richtig sein^^

aber für solche Slider würde ich JQuery empfehlen und dann evtl so einen Slider:
An HTML5 Slideshow w/ Canvas & jQuery | Tutorialzine

allerdings muss du dich da auch erstmal etwas einlesen

Sn0w1 · 11. Juni 2012

AW: [DRINGEND] [JS] 2 onload-funktionen gleichzeitig gehen nicht

Herrlich. Perfekt. Super. Wie auch immer danke für die Antwort, es fehlte am Ende tatsächlich nur noch das "start();" ganz am Ende des Scripts!

Tausend Dank und Greetz

Sn0w1

[GELÖST] [JS] 2 onload-funktionen gleichzeitig gehen nicht

Sn0w1

Freizeitschrauber(in)

MaNT1S

Komplett-PC-Aufrüster(in)

Sn0w1

Freizeitschrauber(in)

Ähnliche Themen