Lightbox einbinden

statics · 16. September 2015

Hallo und Mahlzeit

ich habe folgendes Problem, ich würde gerne eine Lightbox in meine Bilder einbauen

PHP

<?php 		$first_picture = array_shift($bilder);
		echo '<img src="inserate_picture_upload/'.$first_picture['filename'].'" alt="" class="inserate_single_view_picture_first" /><br />';		foreach ($bilder as $row)		{			echo '<img src="inserate_picture_upload/'.$row['filename'].'" alt="" class="inserate_single_view_pictures" />';		}	?>

Kann mir da jemand bitte behilflich sein wie der Link dann aussehen soll

lg

kanufrosch · 16. September 2015

Hallo,

Also Grundsätzlich ist das hier erstmal der falsche Themenbereich.
Den eine Lightbox hat mit PHP nichts zutun (i.R.)

Vielleicht einfach mal erst selber suchen...

http://www.html-seminar.de/bildergalerie-mit-lightbox.htm
http://lokeshdhakar.com/projects/lightbox2/

Gruß Kanu

lucas · 20. September 2015

Also du musst im Header JS und CSS Link angeben ich denke du weisst wie das geht.
Dann musst du eine HTML Class angeben also so class".." es geht auch eine id="..." aber dann musst du noch die CSS Datei umschreiben.
Wie der Poster vormir schon sagte ist das eine HTML Sache.

PHP

<?php
$first_picture = array_shift($bilder);
echo '<img src="inserate_picture_upload/'.$first_picture['filename'].'" alt="" class="lightbox" /><br />';    	
foreach ($bilder as $row)
{echo '<img src="inserate_picture_upload/'.$row['filename'].'" alt="" class="lightbox" />';}
?>

wolf · 20. September 2015

Wenn schon, denn schon.

PHP

<?php
  $PATH = 'inserate_picture_upload/';
  $pictures = [
    0 => [
      'thumbnail' => 'bild1_t',
      'large'     => 'bild1_l',
      'orginal'   => 'bild1_o.png',
      'title'     => 'titel1',
      'alt'       => 'beschreibung1'
    ],
    1 => [
      'thumbnail' => 'bild2_t',
      'large'     => 'bild2_l',
      'orginal'   => 'bild2_o.jpg',
      'title'     => 'titel2',
      'alt'       => 'beschreibung2'
    ],
    2 => [
      'thumbnail' => 'bild3_t',
      'large'     => 'bild3_l',
      'orginal'   => 'bild3_o.jpg',
      'title'     => 'titel3',
      'alt'       => 'beschreibung3'
    ],
    3 => [
      'thumbnail' => 'bild4_t',
      'large'     => 'bild4_l',
      'orginal'   => 'bild4_o.png',
      'title'     => 'titel4',
      'alt'       => 'beschreibung4'
    ]
  ];




  //all pictures
  $i=0;
  foreach ($pictures as $picture){
    echo '
      <a 
        href="'.$PATH.$pictures_first['large'].'.png" 
        data-title="'.$pictures_first['title'].'" 
        data-lightbox="box1" 
        class="'. ($i==0) ? 'inserate_single_view_picture_first' : 'inserate_single_view_pictures' .'"
      >
        <img 
          src="'.$PATH.$pictures_first['thumbnail'].'.png" 
          alt="'.$pictures_first['alt'].'"
        >
      </a>
    ';
    $i++;
  }
?>

Alles anzeigen

Die auswahl der klasse findet über ein 'quick-if' statt ( is_true ? true_value : false_value ).

Lightbox einbinden

Jetzt mitmachen!

Teilen