[PHP] Bildergalerie

[Tanario]

Hallo zusammen,

folgendes problem:

ich habe 8 kleine Bilder zur Auswahl wenn ich auf ein Bild klicke soll dieses groß dargestellt werden, muss ich jetzt acht Unterseiten erstellen oder kann man das mit php lösen ?

Hier die Seite:



Gruß Tanario

[Handymann]

Das geht zwar , aber die komplette Seite müsste immer neu aufgebaut werden , besser wäre da Javascript/JQuery.

[SerkanB]

Sowas in der Art? http://leandrovieira.com/projects/jquery/lightbox/

musst du nach lightbox suchen... denke das trifft ziemlich genau das was du suchst.

[Tanario]

Zitat von SerkanB

Sowas in der Art? http://leandrovieira.com/projects/jquery/lightbox/

musst du nach lightbox suchen... denke das trifft ziemlich genau das was du suchst.

ja nur das diese "lightbox" nicht aufgerufen werden soll sonder das Foto direkt auf der page angezeigt wird ...

[CrazySash]

PHP hilft da nicht wirklich weiter...

Du kannst entweder 8 einzelnen HTML Seite erstellen, wovon ich aber abraten würde.

Oder aber du erstellst eine Seite und tauscht mittels JavaScript das große Bild jeweils aus.

Falls du da Unterstützung benötigst.

Melde dich einfach bei mir.

[tobomator]

schau mal bitte hier nach...

http://www.cottbus-sandow.de/

da ist es auch mit php gelöst wie die Galerie gebaut ist.
Frage ist, willst du sowas haben, daß das Bild in einem neuen Fenster groß angezeigt werden soll, oder im gleichen?
Weil dann kann man das auch mit PHP und einem AJAX Schnipselverbinden.
Du schickst per auswahl den Request an die PHP datei und php lädt das Bild in originalgröße in den DIV Container zur Anzeige ...

Aber nur mit PHP allein geht es nicht.
Deshalb gleich mit JQuery handieren finde ich zuviel des Guten

[tleilax]

Mir war grad langweilig...

PHP wird hier letztendlich nur gebraucht, wenn die anzuzeigenden Dateien dynamisch ermittelt werden sollen oder wenn Javascript aus ist.

Der Javascript-Teil ist bestimmt nicht crossbrowser-tüchtig, aber das sollte schnell anzupassen sein. Insbesondere falls Du schon ein größeres JS-Framework auf der Seite eingebunden haben solltest...

PHP-Code:

1: 2: 3: 4: 5: 6: 7: 8: 9: 10: 11: 12: 13: 14: 15: 16: 17: 18: 19: 20: 21: 22: 23: 24: 25: 26: 27: 28: 29: 30: 31: 32: 33: 34: 35: 36: 37: 38: 39: 40: 41: 42: 43: 44: 45: 46: 47: 48: 49: 50: 51: 52: 53: 54: 55: 56: 57: 58: 59: 60: 61:

<?php     $files = glob('*.{bmp,gif,jpg,png}', GLOB_BRACE); /* Oder wenn das Ganze weniger dynamisch sein soll:     $files = array(         'bild1.jpg',         'bild2.jpg',         'bild3.jpg',     ); */     $file  = isset($_GET['view']) ? $_GET['view'] : reset($files); ?> <style> #gallery {     background: #888;     text-align: center; } #gallery a {     text-decoration: none; } #gallery > img {     height: 400px; } #gallery ul {     list-style: none; } #gallery li {     display: inline-block;     margin: 0 0.5em; } #gallery li img {     height: 64px; } </style> <div id="gallery">     <img src="<?= $file ?>">     <ul>     <?php foreach ($files as $file): ?>         <li><a href="<?= $_SERVER['PHP_SELF'] ?>?view=<?= urlencode($file) ?>">             <img src="<?= $file ?>">         </li>     <?php endforeach; ?>     </ul> </div> <script> (function () {     var image = document.querySelector('#gallery > img');     document.querySelector('#gallery')         .addEventListener('click', function (event) {             var element = event.target;             if (element.parentNode.nodeName === 'A') {                 image.src = event.target.src;                 event.preventDefault();             }         }); }()); </script>

[Tanario]

da ich noch andere Sachen zutun habe habe ich im Lose4Script forum gepostet ...

DANKE trotzdem

[tobomator]

*kopfschüttel*
da gibts ne Lösung für ihn und er postet woanders ...

kann er denn überhaupt programmieren ?

[Tanario]

Danke an tleilax/CrazySash, habe jetzt eine Lösung.