[Firechef]

Hi @ all!

Ich bin im Moment dran, eine neue Homepage für meine Feuerwehr zu basteln. Nun stehe ich vor einem "Problem", von dem ich hoffe, dass Ihr mir bei der Lösung helfen könnt.
Und zwar habe ich zwei Fotos eines unserer Gerätehäuser. Auf dem einen Foto sind die Hallentore geschlossen, auf dem anderen sind sie geschlossen und die Fahrzeuge sind herausgefahren worden. Ich würde das Foto nun gerne so auf die neue Homepage einbinden, dass, wenn ich mit der Maus über eines der Hallentore fahre, das entsprechende Fahrzeug sozusagen aus der Halle "herausfährt". Wenn man dann noch mit der linken Maustaste auf das Fahrzeug klickt, soll der Betrachter zur entsprechenden Seite des Fahrzeuges weitergeleitet werden.

Ich hoffe, ich habe mich verständlich genug ausgedrückt.
Vielen Dank im Voraus.


Gruß
Firechef

[ISurf]

Der Begriff dazu lautet "hover".
Es gibt genug Beispiele dazu im Internet.

Hier ist eins, wo du noch die entsprechenden Werte für das 64x64-Bild ändern musst.
Dabei einfach die beiden Bilder in einer Datei speichern und nebeneinander anordnen.

#beispiel {
     background:url("section/demo.png") 0 0 no-repeat;
     width:64px;
     height:64px;
     display:block;
     padding:0px;
     border-width:0px;
     font-size:0px;
     text-decoration:none;
}

#beispiel:hover { 
     background-position:-64px 0;
}

<a id="beispiel" href="..."></a>

[refLye]

ISurf, da hast du etwas falsch verstanden, seine Feuerwehr wird wohl nicht nur ein Einsatzfahrzeug haben.

Es geht mit hover, wird aber etwas umständlich. Da du ja willst, dass sich jedes Fahrzeug einzeln herausbewegt, müsste man auch die entsprechenden Fotos haben. Beispiel.

Angenommen, ihr habt 4 Fahrzeuge. Dann bräuchtest du folgende Fotos:

• Hallentore geschlossen
• Hallentore offen, Fahrzeuge in der Halle
• Hallentore offen, Fahrzeug 1 herausgefahren
• Hallentore offen, Fahrzeug 2 herausgefahren
• Hallentore offen, Fahrzeug 3 herausgefahren
• Hallentore offen, Fahrzeug 4 herausgefahren

Erschwerend dazu müssten die Autos jedesmal haargenau so stehen wie auf dem vorherigen Bild, sonst sieht es konstruiert aus.

Evtl. einfacher, dafür nicht so hübsch, wäre eine Liste mit den Fahrzeugen. Skizze:


So eine schöne Liste, und beim darüberfahren wird rechts daneben eine Box mit Informationen angezeigt. ^^

[Mr_Braun]

Ich wüsste abgesehen von Flash oder Silverlight keine andere Möglichkeit, seine Wünsche umzusetzen.

[manta656]

doch das geht eigentlich leicht mit hover, sofern das Fahrzeug nicht rausfahren darf sondern einfach nur das zweite Bild läd, wo das Fahrzeug vor den Toren steht. Verlinkst du dann noch die Bilder, so kannst du auch auf die Fahrzeuginformationen hinweisen.

[refLye]

Nein, es funktioniert nicht mit hover. Zumindest nicht ohne Probleme.

[Firechef]

Also ich möchte es im Prinzip so machen, wie es [ Link nur für registrierte Mitglieder sichtbar. Bitte einloggen oder neu registrieren ] realisiert wurde:

Menüpunkt Fahrzeuge, dann "Übersicht"


Wenn's noch eleganter geht, immer gern genommen.

[refLye]

Das ist möglich, aber etwas aufwendig. Dazu musst du das fotografieren, was ich drei Posts obendrüber geschrieben habe.

[Firechef]

Ich habe es nun doch selber hinbekommen ([ Link nur für registrierte Mitglieder sichtbar. Bitte einloggen oder neu registrieren ]): So schwer, wie ich dachte, ist das doch nicht. Einfach ein Foto mit geschlossenen Toren und eines mit herausgefahrenen Fahrzeugen machen, in Einzelteile zerschneiden und dann in Joomla mit dem "Rollover-Effekt" arbeiten und einen Link darüber legen.
Auf jeden Fall werden in der nächsten Zeit noch neue Fotos gemacht, denn die jetzigen entsprechen definitiv nicht mehr dem aktuellen Stand.^^