"Thumbgalerie" oder Thumb Navigation Problem

Pokerface · 20.09.2009

Hallo alle zusammen,
ich fange gerade an meine Website zu erstellen und wollte eine Art "Navigation" mit Thumbs (kleinen Vorschaubildern) erstellen.
ich hatte mir das so vorgestellt:
http://i144.photobucket.com/albums/r176/Reptilica/vorschau.jpg
nun kommt aber dies dabei heraus und ich sehe meine/n Fehler einfach nicht:
http://i144.photobucket.com/albums/r176/Reptilica/screenshot-1.jpg
hat jemand von euch vielleicht gerade Zeit und könnte bitte einmal über den Quelltext rüberschauen?

hier HTML:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title> Versuch Thumbgalerie</title>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15" />
        <link rel="stylesheet" href="style.css" type="text/css" />
        <script type="text/javascript" src="Script.js"></script>
    </head>
    <body bgcolor="#000000">
        <div id="Galerie">
            <div id="Zurueck">
                <img src="Zurueck.png" />
            </div>
            <div id="cEins"> </div>
            <div id="cZwei"> </div>
            <div id="cDrei"> </div>
            <div id="Vor"> 
                <img src="Vor.png" />
            </div>
        </div>
    </body>
</html>

hier die dazugehörige CSS-Datei:

Code:

#Galerie{
    width:450px;
    height:100px;
    background-color:#dd00dd;
    }

#Zurueck{
    width:25px;
    height:100px;
    background-color:#778899;
    float:left;
    }
    
#Vor{
    width:25px;
    height:100px;
    margin-left:25px;
    background-color:#1166ff;
    }

#cEins{
    width:100px;
    height:100px;
    margin-left:25px;
    background-image:(Eins.png);
    }
    
#cZwei{
    width:100px;
    height:100px;
    background-image:(Zwei.png);
    margin-left:25px;
    }
    
#cDrei{
    width:100px;
    height:100px;
    background-image:(Drei.png);
    margin-left:25px;
    }

Wichtig ist, dass die Bilder "Eins.png" usw als Background-Image eingefügt werden wegen des später folgenden Scripts.
mfg

ps: in dem Script "script.js" steht nichts, es hat also keinerlei Bedeutung. (wird später geschrieben

)
außerdem sind einige der "abstrakten" Farben in der CSS nur dazu gedacht die unterschiedlichen Div's besser unterscheiden zu können.

milea · 20.09.2009

AW: "Thumbgalerie" oder Thumb Navigation Problem

hallo!

Dein Pfadangabe bei den background-image ist nicht ganz korrekt. Da fehlt was

Versuch mal:

background-image: url(Zwei.png);

cebito · 20.09.2009

AW: "Thumbgalerie" oder Thumb Navigation Problem

Du lässt nur #zurück "left" floaten, was ist mit den anderen, da steht nix?

Pokerface · 20.09.2009

AW: "Thumbgalerie" oder Thumb Navigation Problem

danke danke, außerdem hab ich bemerkt, dass ich den anderen Div's auch noch ein "float:left;" verpassen muss.

@cebito: Ja stimmt, hab's grade auch selbst bemerkt als die bilder angezeigt wurden.

mfg
geschlossen