Zeilenumbruch bei Bilderdarstellung

[dubster19]

Hallo zusammen,
Folgende Frage: Ich lese mit PHP einen Ordner aus, in dem sich Bilder befinden. Nun hätte ich gerne, dass mir bei der Darstellung im Browser immer 4 Bilder nebeneinander dargestellt werden und danach ein Zeilenumbruch gemacht wird. Ich habe schon etwas von der Funktion "Modulo" gelesen. Ist das der richtige Ansatz?Wenn ja, wie definiere ich die Funktion und eine Variable im Code bei PHP, die für mich mitzählt?
Hier ist mein Ausgangs-Code mit PHP:

<div class="projects">
<?php
$files = glob("http://www.html.de/images/screenshot/screenshot_connect/*");
foreach ($files as $file)
 {
$info = basename($file);
 ?><div class="bilderrahmen"><?php
echo
"<li>
<a href = '$file'>
<img class='simple_pictures' src='$file' alt='Vorschau'>
</a>
 "; " 
</li>"
 ?></div><?php 
}   
foreach ($files as $text){
?><div class="bilderrahmen2"><?php
$info = basename($text);
?><div class="simple"><div class="simple_hovertext"><?php
echo $info  . "\n" ."&nbsp" ."&nbsp";
echo date('r',filemtime($text));
?></div></div></div><?php
}
?>
<div>
</div>

Mfg dubster19

 

[Der Hans]

Setz vor Beginn der foreach-Schleife eine Zählervariable auf den Wert 1, erhöhe diese Variable in der Schleife jeweils um 1 und prüfe, ob der Zähler glatt durch 4 teilbar ist ($var%4). Wenn das zutrifft, fügst du einen Zeilenumbruch ein.

 

[bdt600]

Hat zwar jetzt nix mit dem Thema zu tun, aber wenn ich so einen Quellcode lese, dann wird mir ja fast übel. Tut euch doch selber den Gefallen und rückt den Käse ordentlich ein und wechselt nicht permanent zwischen HTML- und PHP-Code. Ein paar Sekunden mehr investieren und schon ist der Quellcode deutlich lesbarer:

<div class="projects">
<?php
   $files = glob("http://www.html.de/images/screenshot/screenshot_connect/*");
   foreach ($files as $file)
   {
     $info = basename($file);
     echo "<div class='bilderrahmen'>
             <li>
              <a href = '$file'>
                <img class='simple_pictures' src='$file' alt='Vorschau'>
              </a>
            </li>
          </div>";
   }
   
   foreach ($files as $text)
   {
     $info = basename($text);
     echo "<div class='bilderrahmen2'>
             <div class='simple'>
               <div class='simple_hovertext'>
                 $info &nbsp&nbsp" . date('r',filemtime($text)) . "
               </div>
             </div>
           </div>";
   }
?>
</div>

 

[dubster19]

Ich habe es jetzt versucht umzusetzen. Ist der Versuch so richtig?Es möchte noch nicht funktionieren.Wo könnte mein Fehler liegen?

<div class="projects">
<?php
   $files = glob("http://www.html.de/images/screenshot/screenshot_connect/*"); 
     $zahl = "0" ; 
   foreach ($files as $file)
   {
     
     $zahl++;
      if ($zahl%4==0) {
       echo "\n";
       } 
     $info = basename($file);
     echo "<div class='bilderrahmen'>
             <li>
              <a href = '$file'>
                <img class='simple_pictures' src='$file' alt='Vorschau'>
              </a>
            </li>
          </div>";
   }
   
   foreach ($files as $text)
   {
     $info = basename($text);
     echo "<div class='bilderrahmen2'>
             <div class='simple'>
               <div class='simple_hovertext'>
                 $info &nbsp&nbsp" . date('r',filemtime($text)) . "
               </div>
             </div>
           </div>";
   }
?>
</div>

 

[Cheffchen]

Hallo,

das ist im grunde schon ganz gut, nur \n sieht nur html code, umbruch ist <br>
und dies sollte am ender der foreach schleife sein, also bevor } kommt nicht gleich am anfang.

Cheffchen

 

[Der Hans]

Ich würde der Zählervariable keinen String sondern einen Integer-Wert zuweisen.

 

[bdt600]

Und wenn du dann noch die <li> und </li> rausnimmst, ist der HTML-Code auch nicht so fehlerhaft

 

[dubster19]

Danke!!habs mit euren Tipps und ratschläge hinbekommen ;)

Jetzt hab ich noch eine weitere Frage. Ich lasse mir in einem DIV die Informationen über das Bild anzeigen. Nun ist es so, dass die Position auf relative ist. Wenn ich das so mache wird der text nachdem die Bilder geladen wurden unter das div, welches die Bilder beinhaltet, dargestellt.Nun setzte ich die Position-Top auf -2300px(zum Beispiel), damit der text nach oben wandert. Jetzt ist das Problem, wenn ich den Inhalt des Ordners ändere(z.B zwei Bilder hinzufüge),verhaut es mir das ganze Layout. Weil er wieder von dem DIV mit den Bildern die Position berechnet. Ändere Ich nun die Position auf absolute, werden alle Informationen übereinander dargestellt. Kann mir jemand weiterhelfen?

Mfg dubster19

 

[bdt600]

Man stelle sich vor, man könnte was auf der Miniaturansicht erkennen ...

 

[dubster19]

Also ich würde mir gerne die DIVS aus meiner foreach-Schleife von oben links anordnen lassen. Wie stelle ich das an.Wenn ich dem div in dem die Informationen dargestellt werden den Wert position:absolute gebe, so werden mir alle Textfelder auf der gleichen Position übereinander dargestellt.
Hier ist nochmal mein Code:

<div class="projects">
<?php
   $files = glob("http://www.html.de/images/screenshot/screenshot_connect/*");
   foreach ($files as $file)
   {
     $info = basename($file);
     echo "<div class='bilderrahmen'>
             <li>
              <a href = '$file'>
                <img class='simple_pictures' src='$file' alt='Vorschau'>
              </a>
            </li>
          </div>";
   }
   
   foreach ($files as $text)
   {
     $info = basename($text);
     echo "<div class='bilderrahmen2'>
             <div class='simple'>
               <div class='simple_hovertext'>
                 $info &nbsp&nbsp" . date('r',filemtime($text)) . "
               </div>
             </div>
           </div>";
   }
?>
</div>

Kann mir jemand von Euch Profis weiterhelfen?

Mfg dubster19

 

[bdt600]

Was ich schon die ganze Zeit nicht verstehe, warum du dafür überhaupt zwei Schleifen machst. Was spricht denn dagegen, das Bild und die Info in einem div darzustellen?

 

[Der Hans]

Und wozu sind die 3 verschachtelten DIVs für die Info gut? Das geht doch sicher einfacher und ohne so viel Overhead. Abgesehen davon, dass die NBSPs nicht mit Semikola abgeschlossen werden.