Brauche bitte Hilfe für eine Bilder-Gallerie

[Knappe1974]

Ich würde gerne eine eigene Gallerie entwerfen und bin so weit gekommen das ich eine art Tabelle für die bilder in html geschrieben habe,jetzt kommt mein problem ich würde die bilder in der gallerie 50% kleiner darstellen und dann beim anklicken auf originalgröße zu kommen.kann mir einer bitte zeigen wie ich das in die tabelle reinschreiben soll (im quellcode).hier meine tabelle wie ich sie im HTML geschrieben hab.

Code: Alles auswählen

<div>&nbsp;</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div>&nbsp;</div>
<div align="center"><strong><em><span style="FONT-SIZE: 24pt; TEXT-DECORATION: underline">Unsere Gallerie</span></em></strong></div>
<div align="center"><strong><em><span style="FONT-SIZE: 24pt; TEXT-DECORATION: underline"></span></em></strong></div>
<div align="center"><strong><em><span style="FONT-SIZE: 24pt; TEXT-DECORATION: underline">
         <table style="BORDER-COLLAPSE: collapse" align="center">
           <tbody>
             <tr>
               <td></td>
               <td></td>
               <td></td>
            </tr>
             <tr>
               <td></td>
               <td></td>
               <td></td>
            </tr>
             <tr>
               <td></td>
               <td></td>
               <td></td>
            </tr>
             <tr>
               <td></td>
               <td></td>
               <td></td>
            </tr>
             <tr>
               <td></td>
               <td></td>
               <td></td>
            </tr>
             <tr>
               <td></td>
               <td></td>
               <td></td>
            </tr>
          </tbody>
        </table></span></em></strong></div>
<div>&nbsp;</div>

PS:An alle die mir bei diesem Problem beistehen ,jetzt schon ein aller großes

[stundenbanner]

Immer zwischen <td></td> den Bilder Code einfügen. Im Tool-Shop haben wir einen Banner Generator den du natürlich auch für Bilder verwenden kannst:

http://npage-hilfe.bplaced.net/Generatorbanner.php

Bei Ziel Adresse einfach den Link zum Bild eintragen. Als Größe ist vielleicht 320 (höhe) x 240 (breite) nicht schlecht.
Den erzeugten Code zwischen <td></td> einfügen. Hier auch ein Beispiel:

Code: Alles auswählen

    <div>&nbsp;</div>
    <div>&nbsp;</div>
    <div>&nbsp;</div>
    <div>&nbsp;</div>
    <div align="center"><strong><em><span style="FONT-SIZE: 24pt; TEXT-DECORATION: underline">Unsere Gallerie</span></em></strong></div>
    <div align="center"><strong><em><span style="FONT-SIZE: 24pt; TEXT-DECORATION: underline"></span></em></strong></div>
    <div align="center"><strong><em><span style="FONT-SIZE: 24pt; TEXT-DECORATION: underline">
             <table style="BORDER-COLLAPSE: collapse" align="center">
               <tbody>
                 <tr>
                   <td></td>
                   <td><a href="images/k-IMG_0764.jpg" target="_blank">
<img src="im/k-IMG_0764.jpg" alt="Klick hier !" height="240" width="320"
border="0"></a>
</td>
                   <td></td>
                </tr>
                 <tr>
                   <td></td>
                   <td></td>
                   <td></td>
                </tr>
                 <tr>
                   <td></td>
                   <td></td>
                   <td></td>
                </tr>
                 <tr>
                   <td></td>
                   <td></td>
                   <td></td>
                </tr>
                 <tr>
                   <td></td>
                   <td></td>
                   <td></td>
                </tr>
                 <tr>
                   <td></td>
                   <td></td>
                   <td></td>
                </tr>
              </tbody>
            </table></span></em></strong></div>
    <div>&nbsp;</div>

[Knappe1974]

Erstmal danke an stundenbanner ,jetzt werden meine bilder klein dargestellt,aber sie vergrößern sich auf einer neuen seite,ich hatte aber die bilder gerne auf der selben seite groß und wenn ich dann wieder auf das bild klicke sollte das verkleinerte zu sehen sein,so wie bei dreipage2 in deren gallerie,das wäre schön .


Danke Knappe1974

[stundenbanner]

Meinst du sowas ?

Ich habe dieses Sript genommen:

http://www.huddletogether.com/projects/lightbox2

Download:

http://www.huddletogether.com/projects/ ... /#download

Eine Anleitung zum einbauen ist in dem .zip Ordner.

Lässt sich leider nicht bei fertigen Designs einsetzen. Du musst die CSS Datei und die JS Dateien einlagern. Und im Style Header einbauen.

[Knappe1974]

Ja perfekt Super

Ich hab kein fertiges design sondern ein eigenes erstellt.

Meinst du die js dateien hochladen oder??

Die css werde ich in den stylesheet header eintragen ich hoffe das es dann auch geht

[stundenbanner]

Ja, genau. Die JS Datei muss du auch im Header schreiben.

<style type="text/javascript ">
<!--
Inhalt der JS Datei
-->
</style>

[moni]

Hallo Knappe..

hast schon deine Galerie instaliert?...
Habe versucht ,und auf meine test HP auch sie instaliert ..
Alles so gemacht wie der Florian schreibte und auch wie in einleitung steht...doch habe problme mit dem Bilder...
habe die zwei ersten Bilder rein gemacht , aber zu sehen sind sie nicht ...
wenn man anklick auf Bild 1 und 2 da komt zwar das Fenster raus aber ohne Bild...

sieht so halb fertig aus...
http://blicke.npage.de/lichtbox_65287766.html
muss man da besonders was beachten ?

[stundenbanner]

Das wird daran liegen das du die Falsche Bildquelle angegeben hast:

Code: Alles auswählen

<td align="center"><a href="./http://file1.npage.de/005942/00/bilder/dscf1524.jpg" rel="lightbox[tblpas]" title="Bild 1"><img src="./thumb_dscf1524.jpg" border="0" alt="Bild 1"  /></a></td>
        <td align="center"><a href="./http://file1.npage.de/005942/00/bilder/dscf1546.jpg" rel="lightbox[tblpas]" title="Bild 2"><img src="./http://file1.npage.de/005942/00/bilder/thumb_dscf1546.jpg" border="0" alt="Bild 2"  /></a></td>
        <td align="center"><a href="./dscf1548.jpg" rel="lightbox[tblpas]" title="Bild 3"><img src="./thumb_dscf1548.jpg" border="0" alt="Bild 3"  /></a></td>
        <td align="center"><a href="./dscf1549.jpg" rel="lightbox[tblpas]" title="Bild 4"><img src="./thumb_dscf1549.jpg" border="0" alt="Bild 4"  /></a></td>
</tr>
<tr>
        <td align="center"><a href="./dscf1551.jpg" rel="lightbox[tblpas]" title="Bild 5"><img src="./thumb_dscf1551.jpg" border="0" alt="Bild 5"  /></a></td>
        <td align="center"><a href="./dscf1555.jpg" rel="lightbox[tblpas]" title="Bild 6"><img src="./thumb_dscf1555.jpg" border="0" alt="Bild 6"  /></a></td>

        <td align="center"><a href="./dscf1557.jpg" rel="lightbox[tblpas]" title="Bild 7"><img src="./thumb_dscf1557.jpg" border="0" alt="Bild 7"  /></a></td>
        <td align="center"><a href="./dscf1558.jpg" rel="lightbox[tblpas]" title="Bild 8"><img src="./thumb_dscf1558.jpg" border="0" alt="Bild 8"  /></a></td>
</tr>

So sollte es richtig sein:

Code: Alles auswählen

<a href="http://file1.npage.de/005942/00/bilder/dscf1524.jpg" rel="lightbox[tblpas]" title="Bild 1"><img src="http://file1.npage.de/005942/00/bilder/dscf1524.jpg" border="0" alt="Bild 1"  /></a></td>

Natürlich solltest du für die Thubmail Ansicht ein kleineres Bild nehmen oder über HTML eine kleinere Größe angeben. Du kannst nicht einfach einen Ordner anschreiben der bei nPage nicht existiert. So kann das Bild logischer Weise nicht angezeigt werden. Wenn es dann nicht funktioniert wird es daran liegen das es in deinen Quelltext 2 head Bereiche existieren. Wie es aussieht benutzt du kein eigenes Design deswegen solltest du den Head Bereich unter Einstellungen => Header Einstellungen => Eigener, zusätzlicher HTML-Code (zwischen <head> und </head>) eingeben.

[moni]

Danke Florian...
werde mich damit beschäftigen.......

[Knappe1974]

Hallo Stundenbanner,


konnte Deine Lightbox leider nicht einbauen ,
da ich bei dreipage2 keine js Dateien hochladen kann,is nicht schlimm, weil ich einefach, dann ihre bestehende lightbox verwendet habe. :U

Vielen Dank für deine Mühen

LG Knappe 1974