Bilder Zeitgesteuert laden? @ tutorials.de: Tutorials, Forum & Hilfe

Klopfer · 28.10.06 18:17

Hi zusammen,

ich brauche eine kleine Hilfe von euch.
Ich muss ein Ordner alle bilder auslesen und dann alle 5 oder 10 Sekunden automatisch das alte bild durch das neue ersetzen. Die Seite darf sich dabei nicht neu Laden und die Bilder sind alle gleichgroß.

Wie ich den Ordner auslese (wieviel + welche bilder da drin sind), ist für mich kein Problem, aber nur wie funktioniert das Dynamische anzeigen nun?
Von JS hab ich keine Ahnung, aber habs irgendwie im Gefühl dass es damit gehen müsste.

Sollte ich falsch liegen dann helft mir bitte trotzdem.

Danke
Fabi

Biergamasda · 28.10.06 18:24

Hätt gleich mal ne Frage dazu, und zwar - bleiben die Dateinamen gleich oder ändern sich diese? Wenn sie gleich bleiben würd ich es wie folgt lösen. (Könnte sein dass der Cache des Browsers Probleme macht, bin mir aber nicht sicher)

Hmm, Ich weis nicht ob man mit JS ein Bild direkt neu laden kann, du könntest jedoch versuchen, das Ganze in nen Iframe oder Frame zu packen und nur den Frame/Iframe neu zu laden. Demnach würde die Seite bestehen bleiben und das Bild aktualisiert.

Wennn unbedingt nötig, könntest ja auch für jedes bild nen eigenen iframe machen, obwohl, alle in einem is irgendwie klüger :d

lg

Klopfer · 28.10.06 19:32

Ja an ein IFrame hatte ich auch schon gedacht, aber da wäre die Lösung ja zu einfach und zu simpel

Ich hab das schonmal gesehen, gehen tut das auf jeden Fall ohne IFrame. Vll auch in Flash, wenn man da mit ActionScript das Verzeichniss ausliest und alle x Sekunden das Bild in den Film lädt...

Mir fehlt zu dieser Sache einfach des Coders Know How, Im Forum und Google hatte ich mich auch schon zutode gesucht.

Die Bilder werde ich aufsteigend 1,2,3,4,5... nennen.

Fabi

Samuel · 28.10.06 22:45

PHP-Code:


<?php

    // Erstmal die Bilder aus dem Ordner auslesen
    $folder = './pfad/zum/ordner/';
    $dir = opendir($folder);
    while($file = readdir($dir)) {
        if(preg_match('/\.(jpg|jpeg|gif|giff|png|pneg)/', $file))
            $images[] = $file;
    }
    
    // Dann das JavaScript erstellen
    $array_str = implode('\', \'', $images);
    echo "<script type=\"text/javascript\">\r\n";
    echo "var images = new Array('".$array_str."');\r\n";
    echo "function changeImage(imgID) {\r\n";
    echo "\timgID++;\r\n";
    echo "\tdocument.getElementById('id_deines_img_elementes').src = '".$folder."' + images[imgID]';\r\n";
    echo "\tsetTimeout(\"changeImage(imgID);\", 5000);\r\n";
    echo "}\r\n";
    echo "</script>\r\n";
    
    // Die Funktion kannst du dann mit dem Eventhandler onload starten.
    // zB: <body onload="changeImage(0);">
    
    // Du musst dem IMG-Tag auch die ID zuweisen die du in dem JS verwendest das du von PHP erstellen lässt.
    // zB: <img src="..." id="id_deines_img_elementes" />    
    
?>

eventuell hilft dir das weiter... code wurde nicht geprüft. sollte aber funktionieren.
ansonsten gib laut

schöne Grüße
Samuel

Klopfer · 29.10.06 03:02

Hi Samuel,

danke für deine schnelle Hilfe,
Bei mir scheint das irgendwie nicht zu funktionieren. Ich poste dir mal meinen Code, vll hab ich ja was falsch gemacht beim anpassen.

PHP-Code:


<?php
echo"

<style type=\"text/css\">
<!--
.Stil1 {
    font-size: 18px;
    font-weight: bold;
}
.Stil2 {
    font-size: 14px;
    font-weight: bold;
}
-->
</style>

//Hier stand in deinem Script "changeImage(0)";

<body onload=\"changeImage(imgID);\">
";


$dbverbindung = mysql_connect ($host, $user, $password);
$dbanfrage = "SELECT * FROM gebrauchtmarkt WHERE id = '$id'";
$result = mysql_db_query ($dbname, $dbanfrage, $dbverbindung);
 while ($ausgabe = mysql_fetch_array ($result))
 {


    // Erstmal die Bilder aus dem Ordner auslesen
    $folder = $ausgabe[url];
    $dir = opendir($folder);
    while($file = readdir($dir)) {
        if(preg_match('/\.(jpg|jpeg|gif|giff|png|pneg)/', $file))
            $images[] = $file;
    }
    echo $images[0];


    // Dann das JavaScript erstellen
    $array_str = implode('\', \'', $images);
    echo "<script type=\"text/javascript\">\r\n";
    echo "var images = new Array('".$array_str."');\r\n";
    echo "function changeImage(imgID) {\r\n";
    echo "\timgID++;\r\n";
    echo "\tdocument.getElementById('bilder').src = '".$folder."' + images[imgID]';\r\n";
    echo "\tsetTimeout(\"changeImage(imgID);\", 5000);\r\n";
    echo "}\r\n";
    echo "</script>\r\n";

    
    // Die Funktion kannst du dann mit dem Eventhandler onload starten.
    // zB: <body onload="changeImage(0);">
    
    // Du musst dem IMG-Tag auch die ID zuweisen die du in dem JS verwendest das du von PHP erstellen lässt.
    // zB: <img src="..." id="id_deines_img_elementes" />    



echo"
<table border=0 width=750 cellspacing=0 cellpadding=0>
<tr>
<td align=left valign=top>
    <table border=0 cellspacing=0 cellpadding=0 width=350>
    <tr>
    <td align=left valign=top><p class=\"Stil1\">$ausgabe[bootsname]</p></td>
    </tr>
    <tr>
    <td>&nbsp;</td>
    </tr>
    <tr>

//Hier wie beschrieben die ID auch benennen wie oben

    <td align=left valign=top><img src=\"$ausgabe[url]$ausgabe[thumbnail]\" id=\"bilder\"></td>
    </tr>
    <tr>
    <td>&nbsp;</td>
.
.
.
.
.
<td width=20>&nbsp;</td>
<td align=left valign=top>&nbsp;</td>
<td width=20>&nbsp;</td>
<td align=left valign=top>&nbsp;</td>";
 }
mysql_close ($dbverbindung);

echo"</tr>
</table>";
?>

Klopfer · 29.10.06 11:14

So hab es doch noch geschafft
Die Lösungshilfe poste ich doch falls jemand mal fragt wie das geht

PHP-Code:


<?php



$dbverbindung = mysql_connect ($host, $user, $password);

$dbanfrage = "SELECT * FROM datenbank WHERE id = '$kriterium";

$result = mysql_db_query ($dbname, $dbanfrage, $dbverbindung);

 while ($ausgabe = mysql_fetch_array ($result))

 {



echo"<script language=\"JavaScript\">

<!--

";



// Die Bilder aus dem Ordner auslesen und die Anzahl der im Ordnerbefindlichen Bilder ermitteln

$anz_dateien = "0";

$folder = $ausgabe[url];

$dir = opendir($folder);

while($file = readdir($dir)) {

if(preg_match('/\.(jpg|jpeg|gif|giff|png|pneg)/', $file))

$images[] = $file;



//Die Dateien ".", ".." und "Thumbs.db" überspringen

    if($file == "."){

    }else{

     if($file == ".."){

     }else{

      if($file == "Thumbs.db"){

      }else{

      

//Code für die Bilder schreiben lassen die nachher abgespielt werden

if($anz_dateien=="0"){

echo"

var Bilder = new Array(\"".$folder."".$file."\"";

}else{

echo",\"".$folder."".$file."\"";

}

$anz_dateien = $anz_dateien+1;

}

}

}

}



echo");

var Delay = 5000;

";



 

//Glaub der Part ist überflüssig ^^ hatte nur kein nerv mehr das zu probieren obs auch ohne Fehlerfrei geht

$array_str = implode(':', $images);

$pics = explode(':', $array_str, -1);



echo"var BildAnzahl = Bilder.length;

var number = 0;

BildFolge = new Image();

BildFolge.src = Bilder[number];



function change() {



number++;

if (number == BildAnzahl) number = 0;



BildFolge.src = Bilder[number];

document.austausch.src = BildFolge.src;

}



setInterval(\"change()\", Delay);



//-->

</script>";



//Kein <Body onload=.....> verwenden



//das bild wird wie folgt eingebunden damit sich die Bilder auch ändern



<img src=\"bild.jpg\" name=\"austausch\>";

?>

Samuel · 29.10.06 14:26

Wieso einfach wenns auch kompliziert geht?!

*winken*
Samuel

tut orials.de	tut verbinden	tut dir helfen	tut kooperieren
©2000-2012 tutorials.de Alle Rechte vorbehalten	tut informieren » Impressum » Nutzungsregeln » Netiquette » Team » Redaktion	» Tutorials » Videotutorials » Showroom » Events & Contests » Chat » RSS-Feed » Blogs	» der-webdesigner.net » DesignerInAction » Design Nation » Directorforum » Flashhilfe » PHP-Resource » PHPwelt » PSD-Tutorials

Themen-Optionen

Anzeige

Ähnliche Themen

Bilder dynamisch laden und in MovieClip laden

bilder in mc laden

Bilder Laden (.gif .jpg ...)

Bilder laden

Bilder laden

[PHP][Snippet] Array zu XML konvertieren

PHP: LDAP / Active Directory abfragen

E-Mail:

Abonnieren Abbestellen