Anzeige

Probleme mit Lightbox

Probleme mit Lightbox | PSD-Tutorials.de

Erstellt von Mo0nshine, 21.10.2008.

  1. Mo0nshine

    Mo0nshine Rebel Without a Cause....

    111
    Dabei seit:
    26.08.2007
    Beiträge:
    741
    Geschlecht:
    weiblich
    Ort:
    Germany/Austria
    Probleme mit Lightbox
    Hallo Leute,

    ich hab ein Problem mit meiner Lightbox.
    Die wird nicht angezeigt.
    Ich habe am WE angefangen mir meine eigene HP selber zu schreiben, deshalb bitte etwas Nachsicht ;)...

    So ich habe alles genau so gemacht wie es hier steht:

    » dn - Ajax / Javascript Tutorial: Lightbox JS v2.0 einbinden.



    Mein Quelltext sieht so aus:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>aMOA</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8559-1">
    <script type="text/javascript" src="js/prototype.js"></script>
    <script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
    <script type="text/javascript" src="js/lightbox.js"></script>
    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
    </head>
    <body>
    link="#E0DCDE" alink="#E0DCDE" vlink="#E0DCDE">
    <font face="Times New Roman,Times">
    <body bgcolor="#2a2a2a">
    <font color="#E0DCDE">
    <font size=3>
    <body link="#E0DCDE" alink="#E0DCDE" vlink="#E0DCDE">
    <br><img src="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\logo.gif">
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\home.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\art.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\guestbook.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\links.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\contact.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\imprint.gif"
    border="0"></a>
    <br>
    <br>
    <br>
    <br>
    <br>
    <a href="C:\Dokumente und Einstellungen\MIRJA\Desktop\HOMEPAGE\Video Schatzi\CIMG0053.JPG"rel="lightbox"title="my caption">image #1</a>


    </body>
    </html>


    Ich muss dazu sagen, das Bild in Fettschrift ligt in einem anderen Ordner als die HP, da es nur ein Probebild ist... (ich weiß nicht in wie weit das wichtig ist zu wissen)


    Angezeigt wird mir das alles nur als Link auf der Seite und links unten wenn ich mit der Maus auf den Link gehe steht "Fehler auf der Seite"


    ICh hoffe mir kann jemand weiter helfen...

    LG Mirja

    EDIT: Bei Schritt 5. von oben genannter Seite steht:

    So Lightbox JS v2.0 sollte es nun bei euch auf der Webseite funktionieren.

    Es kann jetzt noch zu Fehlern in der Anzeige von den Bildern vom Lightbox JS v2.0 selber kommen. Um diese zu beheben müßt Ihr einfach in der CSS-Datei die Pfade der Bilder anpassen!

    blank.gif findet Ihr in Zeile 48.
    prevlabel.gif und nextlabel.gif findet Ihr jeweils in Zeile 53 und 54.
    So Lightbox JS v2.0 sollte es nun bei euch auf der Webseite funktionieren.


    Habe ich auch gemacht.... nur blank.gif finde ich dort nicht... ansonsten habe ich die Links eingefügt wo die Bilder Pref & Next liegen.


    Alle Ordner von der herunter geladen Datei "Lghtbox" habe ich in dem selben Ordner wie die HP!
     
    Zuletzt bearbeitet: 21.10.2008
    #1      
  2. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    Probleme mit Lightbox
    AW: Probleme mit Lightbox

    <a href="C:\Dokumente und Einstellungen\MIRJA\Desktop\HOMEPAGE\Video Schatzi\CIMG0053.JPG"rel="lightbox"title="my caption">image #1</a>

    hier sollte zwischen .JPG" und rel ein leerzeichen sein.

    bei all den anderen link fehlt das rel="lightbox".

    dieser Bereich ist zudem problematisch:
    Code (Text):
    1.  
    2. <body>
    3. link="#E0DCDE" alink="#E0DCDE" vlink="#E0DCDE">
    4. <font face="Times New Roman,Times">
    5. <body bgcolor="#2a2a2a">
    6. <font color="#E0DCDE">
    7. <font size=3>
    8. <body link="#E0DCDE" alink="#E0DCDE" vlink="#E0DCDE">
    9.  
    es darf nur EINEN <body-tag geben:
    Code (Text):
    1.  
    2. <body bgcolor="#2a2a2a"  link="#E0DCDE" alink="#E0DCDE" vlink="#E0DCDE" bgcolor="#2a2a2a">
    3.  
    obwohl das inzwischen unüblich ist, so zu machen.
    <font tags sind wirklich ganz out (wird per css genmacht)
     
    #2      
  3. Mo0nshine

    Mo0nshine Rebel Without a Cause....

    111
    Dabei seit:
    26.08.2007
    Beiträge:
    741
    Geschlecht:
    weiblich
    Ort:
    Germany/Austria
    Probleme mit Lightbox
    AW: Probleme mit Lightbox

    Das mit dem Leerzeichen hab ich gemacht.. aber das funkt trotzdem nicht :(

    Die anderen Bilder dort haben nichts mit der lightbox zu tun...

    Zu... Bereich HG farbe. etc... danke.. dann kann ich das zusammen fassen!

    LG
     
    Zuletzt bearbeitet: 21.10.2008
    #3      
  4. tiroler

    tiroler Hat es drauf

    14
    Dabei seit:
    04.11.2006
    Beiträge:
    2.202
    Geschlecht:
    männlich
    Ort:
    Pfalz und Tirol
    Software:
    CS4, C4D R10
    Kameratyp:
    Canon EOS 400D+L-Obj.
    Probleme mit Lightbox
    AW: Probleme mit Lightbox

    HI,
    wichtig ist:
    die richtige Pfadangabe zu den Bildern
    alle Bilder im entsprechenden ordner ( dir grossen wie die kleinen )
    der richtige aufruf im html bereich:
    ich habe das so gelöst:

    im body:
    [​IMG]

    und im header:
    <head>
    :::::::::::::::::::::::::::::::::::

    <!--lightbox2-->
    <script type="text/javascript" src="js/prototype.js"></script>
    <script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
    <script type="text/javascript" src="js/lightbox.js"></script>
    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
    <!--lightbox2-->

    </head>

    meine bilder liegen also unter images


    hier kANNST du dir das mal ONLINE anschauen: klick mich
     
    Zuletzt bearbeitet: 22.10.2008
    #4      
  5. Mo0nshine

    Mo0nshine Rebel Without a Cause....

    111
    Dabei seit:
    26.08.2007
    Beiträge:
    741
    Geschlecht:
    weiblich
    Ort:
    Germany/Austria
    Probleme mit Lightbox
    AW: Probleme mit Lightbox

    Hi Tiroler... du bist ja supi.. danke.. ich seh nämlichgrade ich hab überhaupt kein zweites bild angehängt... ich glaub ich bin schon ganz gagga.. ich werds dann mal so probieren...

    LG Mirja


    @ Tiroler:

    So.. ich hab das jetzt mal geändert.. zumindest werden die Bilder angezeigt.. nur... es gibt nicht diesesn Effekt... es wird einfach ein neues Fenster geöffnet...

    Si siehts jetzt aus:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>aMOA</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8559-1">
    <!--lightbox2-->
    <script type="text/javascript" src="js/prototype.js"></script>
    <script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
    <script type="text/javascript" src="js/lightbox.js"></script>
    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
    <!--lightbox2-->
    </head>
    <body>
    link="#E0DCDE" alink="#E0DCDE" vlink="#E0DCDE">
    <font face="Times New Roman,Times">
    <body bgcolor="#2a2a2a">
    <font color="#E0DCDE">
    <font size=3>
    <body link="#E0DCDE" alink="#E0DCDE" vlink="#E0DCDE">
    <br><img src="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\logo.gif">
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\home.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\art.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\guestbook.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\links.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\contact.gif"
    border="0"></a>
    <a
    href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\imprint.htm"><img src="
    C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\bilder\imprint.gif"
    border="0"></a>
    <br>
    <br>
    <br>
    <br>
    <br>
    <div align="center">
    <a href="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\lostwing-thumb.gif" rel="lightbox"><img src="C:\Dokumente und Einstellungen\MIRJA\Desktop\hp amoa\lostwing-klein.gif" width="50" height="38" border="1" alt="klicken zum vergr&ouml;ssern"/></a>
    </div>

    </body>
    </html>



    Auf jeden Fall habe ich mir des zeugs nochmal runter geladen.."lightbix" und die dateien css und js in die originale eigetauscht.. vielleicht durfte ich dort nichts ändern? NAja.. langes blablal ... es geht trozdem noch nicht.. :(
    An was kann das denn liegen?


    EDIT:

    SUUUPPIIIII ES GEHT!!

    DANKESCHÖN :)
     
    Zuletzt bearbeitet: 22.10.2008
    #5      
x
×
×
teststefan