Bild ein/aus faden

[lucarp]

Hallo,

Ich habe folgendes Script um eine Reihe von Bildern nacheinander anzuzeigen:

<script language="javascript1.2">
        var fotos=new Array('Bild1',
           'Bild1',
           'Bild1',
           'Bild1');

                 var speed=2000;
		 var pos=0;
		
		function doit () {
		
		if (!(document.images)) {return;}
		
		 document.bild.src=fotos[pos++];
		
		 if (pos == fotos.length) { pos = 0; }
		 setTimeout("doit();",speed);
		}
		</script>

Nun habe ich 2 Fragen.

Die erste wäre:
Wie kann ich die Bilder langsam ein und ausfaden damit das alles etwas sanfter wird?

und :
kann ich die Bilder mit PHP aus eine MYSQL holen und den PHP Code direkt statt den Bilderangaben einsetzen?
denn die ausgabe ist ja die gleich aber es funktioniert irgendwie nicht.

var fotos=new Array(<?php
        $box =  mysql_query("SELECT * FROM `table` ORDER BY RAND(NOW())");
        while ( $pic = mysql_fetch_assoc($box) )
            {
            echo "'Bildpfad" . $boxpic['bild'] .".png',";
            }
        ?>
            );

         var speed=2000;
         var pos=0;

danke

 

[crash]

1. Ja du kannst opacity und einen filter für den IE setzen
2.

<?php
        $box =  mysql_query("SELECT * FROM `table` ORDER BY RAND(NOW())");
        $bilder = array();
        while ( $pic = mysql_fetch_assoc($box) )
            {
                $bilder[] = $boxpic['bild']
            }
        ?>

später dann:

var fotos = <?php print json_encode($bilder); ?>;

 

[lucarp]

Also ich habe jetzt noch eine Weile mit opacity herumprobiert aber es nicht wirklich hinbekommen, das bild aus und das nächste einzublenden.

vielleicht kann mir ja jemand einen Denkansatz geben.

was ich desweiteren noch erreichen möchte wäre, dass die jeweiligen Bilder auch mit einem ziel verlinkt werden..

wie mache ich das?
die Links habe ich auch in der MySQL jedoch habe ich keine Ahnung wie ich das mit Javascript hinbekomme, dass eben auch noch der entsprechende Link um das Bild gelegt wird.

grüße

 

[Gilles]

Hallo lucarp,

Zu deinem problem mit dem Faden gibt es nun mehrere Möglichkeiten.
Die leichteste wäre ein Framework wie script.aculo.us - web 2.0 javascript
oder jQuery: The Write Less, Do More, JavaScript Library einzusetzen. Die haben Fade Funktionen.

Die andere Möglichkeit ist es die opacity funktionen zu benutzen. Beachte hier bei, dass der IE und Firefox verschiedene Attribute für opacity haben. Ich rate dir aber schwer, dass du eins der Frameworks benutzt, da es sonst unnötige Schreibarbeit wäre.

Zu der Geschichte mit dem Mysql.
Wie crash schon geschrieben hat. kannst du über php folgendes hinzufügen.

<?php

/* über PHP mysql db auslesen */

// schreibe jetzt nur ab dem select ;)
$bilder = mysql_query("Select bildUrl from bilder");

$meinBild = array();

while( $bild = mysql_fetch_array($bilder) ) {
  // Array befüllen mit Bild Daten
  array_push($meinBild, $bilder['bildUrl'];

}


/* Zum String machen */

$meineBilder = $meinBild[0];

// Schleife durchlaufen um String zu erstellen
for($i=1; $i < (count($meinBild)-1); $i++) {
  $meineBilder .= "," . $meinBild[$i];
}

 


?>

 <script>

var meineBilder = [<?php echo $meineBilder; ?>];

</script>

Und schon hast du dein Arrray mit Bildern, Mit den Links ist das genau das selbe. Hoffe konnte ein wenig helfen. (Wobei crash ja nichts anderes gezeigt hat ^^)

 

[crash]

Statt einer Schleife hätte nicht auch ein implode(',', $bilder) gereicht? Wobei mein json_encode() noch etwas sauberer ist.

 

[Gilles]

Statt einer Schleife hätte nicht auch ein implode(',', $bilder) gereicht? Wobei mein json_encode() noch etwas sauberer ist.

pwned
Hab das runter geschrieben, was mir durch den Kopf gegangen ist.
Implode ist mir da garnicht durch den Kopf gegangen.
Und wegen json. Dachte mir ich schreib dann einfach nur die ausführlichere Weise. Vielleicht kennt er Json ja nicht. Aber du hast schon Recht