MouseOver - wie geht das denn ???

grafikknecht · 13.02.2011

Hi - ich bin Neuling bei Photoshop.

Ich möchte ein Projekt entwerfen, bei dem ein Feuerwehrfahrzeug in der Seitenansicht zu sehen ist. Wenn mit der Maus über die diversen Klappen und Türen "gefahren" wird, dann soll sich für die Zeit, in der sich der Mauszeiger über der Klappe befindet, ein Foto mit einer Detailansicht des Fachinhalts sichtbar werden. Sobald der Mauszeiger die Klappe wieder verlässt, soll sich das Fenster mit der Detailansicht wieder schliessen.
Ich versuche verzweifelt so etwas zu erstellen. Sicherlich geht das irgendwie mit Slices. Nur wie ... ???
Für eine Schritt-für-Schritt-Erklärung wäre ich unendlich dankbar.

Liebe Grüße -der Grafikknecht-

gargamelix · 13.02.2011

AW: MouseOver - wie geht das denn ???

Da musst du mit deinem Anliegen mal in den Webbereich.

spacle · 13.02.2011

AW: MouseOver - wie geht das denn ???

also ich würde das (und jetzt haltet mich nich für verrückt) mit CSS realisieren.

Einfach Bild als BG für dein Element machen und dem dann position:relative; geben und dann legst du dir noch nen paar elemente an die du dann so in etwa definierst:

Code:

div#Feuerwehrfahrzeug div#Klappe1 {
background:none;
position: absolute;
left: 1234px;
top: 1234px;
}

div#Feuerwehrfahrzeug div#Klappe1:hover {
background:detailansicht;
position: absolute;
left: 1234px;
top: 1234px;
}

im html sieht das dann so aus:

HTML:

<body>
<div id="feuerwehrfahrzeug">
<div id="Klappe1">
</div>
</div>
</body>

und ab damit in den web bereich^^

edit: du willst keine links, ne?^^

KaisyTom · 13.02.2011

AW: MouseOver - wie geht das denn ???

Ich gebe meinem vorredner da recht, wobei es reicht, wenn du den teil mit position: absolute; left: x px; top: x px; nur einmal reinschreiben musst. Aber es wäre das was du beschrieben hast.

spacle · 13.02.2011

AW: MouseOver - wie geht das denn ???

ich weiss doch^^ habe nur mein element kopiert und hover reingeschrieben. um das nochmal genauer aufzugreifen: in das hover element muss man nur das reinschreiben, was anders als im eigentlichen element sich ändern soll

ElevatorToHell · 13.02.2011

AW: MouseOver - wie geht das denn ???

also ich würd es mit javascript machen...

KaisyTom · 13.02.2011

AW: MouseOver - wie geht das denn ???

ElevatorToHell schrieb:
also ich würd es mit javascript machen...

Da Javascript nachwievor abstellbar ist, sollte man CSS benutzen, wenn die Benutzerfreundlichkeit nicht, oder nur in minimalem Maße beeinträchtigt wird :O, also ist meine Meinung dazu...

spacle · 13.02.2011

AW: MouseOver - wie geht das denn ???

Mit javascript wäre es dann aber glaube ich doch eleganter gelöst^^ das problem is nur dass ich es nicht kann, flash wäre eine andere gute option. css war meiner meinung nach eine notlösung darum auch das "haltet mich nich für verrückt"

@ threadersteller: möchtest du nicht mal sehen wie es deinem thread so geht bzw wie es mit den antworten aussieht? xDD

Myhar · 14.02.2011

AW: MouseOver - wie geht das denn ???

Flash wäre dafür meiner Meinung nach keine gute Option. Wie KaisyTom schon gesagt hat, ist JS auch abstellbar, weshalb ich mich ihrer Meinung, das ganze mit CSS zu realisieren, anschließen kann. Man kann ja zusätzlich zu der CSS Lösung eine JS Lösung einbauen, mit der dann vielleicht einen fade-in Effekt von dem einzublendenden Effekt realisiert.
Als Verbesserung für die Lösung von spacle würde ich vorschlagen, den hover nicht auf ein div sondern auf ein a-Element zu legen, da dies der IE auch versteht.

KaisyTom · 14.02.2011

AW: MouseOver - wie geht das denn ???

spacle schrieb:
Mit javascript wäre es dann aber glaube ich doch eleganter gelöst^^ das problem is nur dass ich es nicht kann, flash wäre eine andere gute option. css war meiner meinung nach eine notlösung darum auch das "haltet mich nich für verrückt"

... ähm... ne... warum JS unpraktisch ist, habe ich ja schon erläutert und solange die benötigten Funktionen mithilfe der Layout- und Struktur-Sprachen zu ermöglichen ist sollte man das Programmieren in Sprachen wie PHP, JS, etc. lassen, da das nur mehr Rechenleistung benötigt, was es bei "elegantem" Programmierstil meiner Meinung nach zu verhindern gilt.
Flash... naja... unterstützungsprobleme, hoher Rechenaufwand, Arbeitsaufwand, da man es erst lernen muss... Flash ist gut wenn man wirklich davon ausgehen kann, dass der anwender Flash installiert hat (zugegeben bei den meisten PCs), es kann die Erreichbarkeit aber stark einschränken. Da der Themenersteller (der wirklich mal wieder was sagen könnte ^^) sich schon als Photoshop-Neuling "outet" wäre das direkte erlernen von Flash und womöglich noch Action-Script und zusätzlich vielleicht sogar noch die standardmäßige hobbyweiterbildung in HTML, JS, CSS, PHP, etc. vielleicht etwas viel verlangt.