Homepage Design + Mouseover

[Lutzi]

Guten Tag,

hab auch wiedermal ne Anfängerfragen. So arbeite nun an meinem zweiten Desing und finde es bis jetzt eigentlich sehr passabel für den zweiten Versuch. Die Homepage dient für ein Schulfest und das Logo des Festes bzw. das Motto sind Palmen. Meine primäre Frage ist jetzt eigentlich wie mache ich da nen Mouseover. Ich will das wenn man mit dem Pfeil über "Home" geht, die kleine Palme daneben eine andere Farbe bekommt. Also ich Slice denn Style zuerst und dann mach ich "für Web speichern". Dann bekomme ich einen Ordner mit allen Bildern und die HTML Datei. Dann bearbeite ich die HTML Datei im Dreamweaver und füge nen Mouseover ein. Aber jetzt die Frage: Wie kann ich die einzelnen Bilder als .psd haben, oder besser gesagt kann mir einer sagen wie ich jetzt zum Beispiel dann nur den Button Home am leichtesten verändern kann?

Kritik und Verbesserungsvorschläge sind natürlich auch gern erwünscht. Also im Hintergrund kommt auf jeden Fall mal noch ne Struktur rein nicht das ihr denkt der bleibt so langweilig grau. Naja dann würde ich mich freuen wenn mir jemand einen Rat geben kann.

Screenshot: http://martinlutz.at/homepage.gif

Mit freundlichen Grüßen
Lutzi

[fluuu]

Hallo,
also viel ist nicht zu sehen außer dieser Photoshop-Design-Vorlage.
Arbeite auch mit Dreamweaver, jedoch baue die Website dort mit HTML und CSS auf,
die Mouseover für Text werden gleich mit eingebaut und die für Grafiken werden mit dem
Bedienfeld Verhalten programmiert. Jetzt die Anwendung von Dreamweaver zu beschreiben
wäre ein Kurs von vielen Stunden, da müsstest Du Dich selbst einarbeiten und wenn eine
konkrete detaillierte Unklarheit auftaucht, hier fragen. Aber die Frage wie macht man Mouseover
mit Dreamweaver sprengt das Forum.
Ansonsten ist es so, dass Du immer mindestens zwei gleichgroße Grafiken brauchst die durch Mouseover
getauscht werden, dies wird mit dem Bedienfeld Verhalten erreicht.
Siehe hier z.B.
http://www.uni-kassel.de/hrz/db4/extern ... halten.htm

gruß fluuu

[Lutzi]

Naja das Design ist zwar keine Vorlage sondern hab ich selbst gemacht aber geb zu schaut schon etwas typisch aus. Ja ich weiß das es noch irgendwie nicht gerade vollgebaut ist aber wollte eigentlich zuerst nur das mit dem Mouseover wissen. Du hast meine Frage nicht ganz richtig verstanden aber weiß irgendwie nicht wie ich die richtig formulieren soll damit man sie versteht...*g*

Also ich versuchs nochmal:
Ich habe den Style gesliced und alle Buttons haben selbstverständlich ein eigenen Teil. Nun speicherts die mir als .gif ab. So und jetzt muss ich ja nur den einen Slice (z.B. den Button "Home") umwandeln. Und wie mach ich das damit ich nur den einen Button so öffne damit ich den schön verändern kann, sprich als .psd! Denn ich kann ja nicht das abgespeicherte .gif öffen, da ich sonst ja das ganze mühsam verändern müsste.

Ist wieder komplett komisch geschrieben aber ihr seht scho ich hab nicht gerade nen Haufen Ahnung von dem Zeugs aber villeicht verstehts ja jemand und hat die Muse mir das kurz zu erklären.

[Scooby]

Ich glaub er hat das mit der Vorlage nicht so gemeint, dass sie nicht von dir ist, sondern eine von dir gefertigte Vorlage für die Homepage ist.

Zu deiner Frage:
Ist zwar schon länger her, aber ich hab glaub ich immer 2 Ebenen erstellt, einmal den Button im Normalzustand und einmal im Mouse-Over-Zustand, mit ImageReady (wie's in PS CS3 ist weiß ich nicht) dann eingestellt, dass bei Mouse-Over die Ebene für den Mouse-Over-Zustand angezeigt wird.
Hoffe das hilft dir weiter

MfG
Scooby

[Manuel]

Also meines Erachtens gibt es nur eine wahre Möglichkeit, Mouseover-Buttons mit CSS zu machen und zwar machst du deine normale Buttongrafik, direkt darunter in der gleichen Datei ein weiteres Mal die Grafik als Mouseovergrafik, dann bindest du den Button so ins Design ein, dass lediglich der obere Teil zu sehen ist und verschiebst die Grafik dann dementsprechend nach oben, so dass dann beim Mouseover der untere Teil zu sehen ist.

Grund dafür: Keine Ladezeiten beim ersten Mouseover, da die Buttons direkt vollständig beim ersten Laden der Seite geladen werden.

In diesem Forum hier wirds ebenfalls so gemacht:



Lg,
Manuel

[Lutzi]

Danke für deine Antwort. Ich werd ma schauen ob ich das so hinbekomme wie du das beschrieben hast. Halt ich meine vom coden hab ich eh keine Ahnung aber ich denke ich werd sie einfach mal untereinander machen!