Bilderwechsel die 2te

[flavor]

Hallo,

ich habe eine Slideshow (Javascript) in mein Header eingebunden, die mir weiche Bildübergänge ermöglicht. Bilderwiedergabe funktioniert nach der Reinfolge auch wunderbar. Leider bekomme ich es nicht gebacken die zufällige Bilderwiedergabe zu erzwingen. Hat vieleicht einer eine Lösung parat?

PHP-Code:

window.addEventListener?window.addEventListener("load",so_init,false):window.attachEvent("onload",so_init);

var d=document, bilder = new Array(), zInterval = null, aktuell=0, pause=false; bilderAnzahl=5; bilderPfad="../media/images/"; geschwindigkeit=10000;

function so_init() {
    if(!d.getElementById || !d.createElement)return;    
    
    // erstes Bild wird eingelesen
    bild = d.getElementById("slideshow").getElementsByTagName("img");
    bilder[0] = bild[0];
    bilder[0].style.display = "block";
    bilder[0].xOpacity = .99;

    bilder[1] = new Image();
    bilder[1].src = bilderPfad + "002.jpg";
    bilder[1].xOpacity = 0;
    d.getElementById("slideshow").appendChild(bilder[1]);
    
    setTimeout(so_xfade,geschwindigkeit);
    neuesBild();
}

function so_xfade() {
    cOpacity = bilder[aktuell].xOpacity;
    nIndex = bilder[aktuell+1]?aktuell+1:0;
    nOpacity = bilder[nIndex].xOpacity;
    
    cOpacity-=.05; 
    nOpacity+=.05;
    
    bilder[nIndex].style.display = "block";
    bilder[aktuell].xOpacity = cOpacity;
    bilder[nIndex].xOpacity = nOpacity;
    
    setOpacity(bilder[aktuell]); 
    setOpacity(bilder[nIndex]);
    
    if(cOpacity<=0) {
        bilder[aktuell].style.display = "none";
        aktuell = nIndex;
        setTimeout(so_xfade,geschwindigkeit);
        neuesBild();
    } else {
        setTimeout(so_xfade,50);
    }
    
    function setOpacity(obj) {
        if(obj.xOpacity>.99) {
            obj.xOpacity = .99;
            return;
        }
        obj.style.opacity = obj.xOpacity;
        obj.style.MozOpacity = obj.xOpacity;
        obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")";
    }    
}

function neuesBild() {
    // immer ein Bild vorausladen
    if ( (aktuell < (bilderAnzahl-2)) && (bilder.length < bilderAnzahl) ) {
        bilder[aktuell+2] = new Image();
        bilder[aktuell+2].src =  bilderPfad + "0" + ((aktuell+3)<10 ? "0" + (aktuell+3) : (aktuell+3)) + ".jpg"
        bilder[aktuell+2].xOpacity = 0;
        d.getElementById("slideshow").appendChild(bilder[aktuell+2]);
    }
} 


Liebe Grüße

Claudia

[objekt]

gelöscht. Hatte ein Bsp. Wo zufällig ein Bild pro besuch angezeigt wird ohne slideshow

[flavor]

Ach wie schade...

[df:bug]

Hallo,

mit Zufallzahlen arbeiten?

Link: Zufallszahlen in Javascript mit Math.random()

Viele Grüße,
df:bug

[flavor]

Zitat von df:bug

Hallo,

mit Zufallzahlen arbeiten?

Link: Zufallszahlen in Javascript mit Math.random()

Viele Grüße,
df:bug

Phuu,

danke fü den Link. Der Code scheint nicht optimal zu sein, hat mich aber zu diesem hier geführt.

PHP-Code:

function ZufallszahlGenerieren(Minimum, Maximum)
{
    var Zufallszahl = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
    alert(Zufallszahl);
} 


ich versuche es schon seit Stunden ohne Erfolg. Die einzige Veränderung die ich erziele ist die, das die Bilder einfach nicht mehr weiterlaufen. Ich weiß nicht ob es daran liegt das die Slideshow mit 00x.jpg arbeitet, oder ob ich den Code falsch einsetze. Javascript ist eine verfluchte Angelegenheit! Hat vielleicht einer eine Lösung für dieses Problem?

Beste Grüße Claudia

[amilo]

Hallo,

warum machst du dir die Mühe das mit Javascript umzusetzen, wenn es doch zig fertige Slideshows für JQuera gibt?

Das dürfte um einiges einfacher sein.

MfG. Hansen

[flavor]

Zitat von amilo

Hallo,

warum machst du dir die Mühe das mit Javascript umzusetzen, wenn es doch zig fertige Slideshows für JQuera gibt?

Das dürfte um einiges einfacher sein.

MfG. Hansen

Hallo Hansen,

JQuery Plugins sind eine wirklich sehr schöne Sache, z.B Cycle oder Nivo Slide, allerdings habe ich kein Plugin gefunden das die Bilder vorläd(ajax!?). Da bei der Menge der Bilder die Startseite ewig braucht bis sie geladen ist.

LG

[amilo]

Hi,

wenn du dich mit dem Cycle Plugin schonmal auseinandergesetzt hast, könnte das eine einfache Lösung für dich sein.

MfG. Hansen

[flavor]

Hi,

danke Hansen. Das ist genau das was ich gesucht habe. Zwar kann man sich hier nicht weitere Bildübergänge als "fade" aussuchen, aber das reicht mir so. Habe es HIER probehalber eingebaut und läuft super. Allerdings schaffe ich es nicht das Plugin in den Shop einzubauen. Wenn ich den Script in die index.html vom Template einbaue, bekomme ich ein weißes Bild. Eine header.php finde ich auch nicht. Wo kann ich den den Code einbauen?

LG Claudia

P.S. ironischerweise funktioniert hier nur die Shuffle Funktion :-)

[flavor]

Hat sich erledigt, habe rausbekommen das hier js.php als head Bereich dient und der index.html als Body, somit ist alles klar. Für die die es wissen wollen: der Script muss in die js.php.

Leider überzeugt die Shuffle Funktion mich nicht 100%tig. Die Math.Formel ist einfach nur dünnes... zu viele Wiederholungen der selben Bilder. Eine andere Möglichkeit sehe ich im Moment nicht.