kajuma: (Bilder+Links) durch Link in andere (Bilder+Links) ändern!

Hi,
ich bastel mir mal wieder eine neue website und stehe vor einem Problem.
Ich habe angefangen eine Seite in Phtotoshop zu entwerfen (Design) und mir dann aus dem Bild über Slices eine Website zu machen.
Soweit komme ich auch klar.
Dieses mal wollte ich auf die von mir sonst genutzten Frameset-Konstruktionen verzichten und hab deswegen Probleme!

Ich habe im oberen Bereich Rollover-Images mit Links (z.B.) zu meinen Fotoalben.
Wenn dieser geklickt wird sollen sich auf der linken Seite einige Slices (Bilder) in andere Bilder mit Link auf das jeweilige Album ändern.
Das möchste ich für fast alle oberen Buttons so gestalten.

Bisher habe ich das ganze mit einem Javascript gelöst und dann immer das main-Frame und das linke-Frame neu gelasen über einen Link.
So konnte ich den Inhalt zu den Links anpassen.

Kann mir jemand helfen wie ich das jetzt lösen kann? Habe dazu noch nichts gefunden. Alle anpassungsversuche des Scripts scheiterten an meinem "Wissen"!

Danke euch!

Die Website steht schon, soweit ich sie habe auf:

www.kajumavidz.de

  1. Dieses mal wollte ich auf die von mir sonst genutzten Frameset-Konstruktionen verzichten

    Das ist schonmal nicht schlecht. Aber dafür ein Tabellenkonstrukt zu verwenden ist schlecht. Schau mal http://de.selfhtml.org/css/layouts/@title=hier rein. Da du noch relativ am Anfang bist, wäre das es recht sinnvoll, Alles nochmal richtig zu machen.

    Gruss Fragipani

    1. Ohje,
      da habe ich  ja noch was vor mir!
      Was ist denn "nicht" gut an einer solchen Konstruktion?

      Danke für die Antwort!

      1. Ohje,
        da habe ich  ja noch was vor mir!

        Kann sein, aber am Ende wirst du recht froh darüber sein...

        Was ist denn "nicht" gut an einer solchen Konstruktion?

        Da gabs hier im Forum schon unzählige Threads über dieses Thema. Du kannst entweder mal ein wenig im Archiv stöbern, oder auch mal hier vorbei schauen.
        Wie gesagt: Da gibt es schon massig Diskussionen über das Thema. sonst einfach mal die allwissende Suchmaschine fragen...

        Gruss

  2. Ok,
    ich habe mich die letzten Stunde bemüht etwas in das Thema einzutauchen und einige kleine Beispiele programmiert.
    Dabei ist mir nicht klar wiie ich das ganze umsetzten soll.

    Meine jetztige Seite ist von Photoshop in einer Tabellenkonstruktion mit enthaltetenen Grafiken erstellt.
    Das sind ne Mene kleine Grafipuzzleteile die genau zusammengesetzt werden müssen.

    Soll ich dann in CSS für jeden Schnipsel einen Bereich definieren, dessen Eigenschaften festlegen und ihn genau ausrichten?
    So als Beispiel:

    <style type="text/css"><!--
    body

    #Bild1 {
    height:30px;
    padding:5px;
    text-align:center;
    background-color:#9c9a63;
    }

    #Bild2 {
    color:#ffffff;
    background-color:#4a4d18;
    text-align:center;
    padding:10px 0px;
    }

    #Bild3 {
    border-top:1px solid #000000;
    background-color:#e7d3bd;
    padding:5px;
    color:#000000;
    }
    //--></style>

    Das ergibt noch keinen Sinn. Hab das nur als Beipiel zusammen kopiert!

    Wäre ne menge Arbeit und ich versteh auch nicht ganz wie ich die Ausrichtung und Größen möglichst einfach bekomme, so das es eben zusammen ein Bild ergibt!

    Weswegen man das macht habe ich inzwischen gelesen und auch verstanden. Wobei die mietsne Argumente mir "egal" sind! Aber ich will das endlich mal bisschen gescheiter können!

    1. Weswegen man das macht habe ich inzwischen gelesen und auch verstanden. Wobei die mietsne Argumente mir "egal" sind! Aber ich will das endlich mal bisschen gescheiter können!

      Es ist immer löblich, wenn man lernwillig ist.

      Mit den Grafiken gibt es verschiedene Ansätze. Bei deinem alten Tabellenlayout, war das 1 zu 1 umsetzbar, da du wahscheinlich eine feste Grösse für deine Tabelle hattest. Jetzt solltest du ja mit flexiblen, auf den Viewport des Benutzers angepassten Grössen arbeiten.

      Dazu solltest du Grafiken haben, die sich in der Länge, bzw. Breite wiederholen können. Beispielsweise hast du eine Grafik für eine linke Ecke und für eine rechte Ecke. Dazwischen kommt dann eine gerade Grafik, die sich wiederholt. So sieht es dann immer gut aus und "wächst" mit der Grösse des Viewports.

      Schau dir am besten mal Tutorials an. Das wird genauer beschrieben, wie isch das jetzt mit den 2-3 Sätzen gemacht habe.

      Hab mir die Seite noch nicht genauer angeschaut, aber vielleicht ist die ja das, was du suchst: Convert PSD to XHTML Layouts

      Gruss