inaK: Bilderslideshow bei Hover

Hallo liebes Forum,

ich würde gerne einen Hover-effekt auf meine Seite einbauen, der bei horizontalem Fahren über das Bild den Bildinhalt wechselt. Es erscheint also nicht nur ein Austauschbild, wenn ich mit der Maus drüberfahre, sondern es wird eine Art Vorschau gezeigt (das Bild funktioniert als link für eine unterseite).
Ich habe das so schon einmal gesehen...Hat jemand eine Ahnung, wie so etwas funktionieren könnte?

Liebe Grüße

  1. Hallo liebes Forum,

    ich würde gerne einen Hover-effekt auf meine Seite einbauen, der bei horizontalem Fahren über das Bild den Bildinhalt wechselt. Es erscheint also nicht nur ein Austauschbild, wenn ich mit der Maus drüberfahre, sondern es wird eine Art Vorschau gezeigt (das Bild funktioniert als link für eine unterseite).
    Ich habe das so schon einmal gesehen...Hat jemand eine Ahnung, wie so etwas funktionieren könnte?

    Müsste in etwa so funkzionieren

    Dein erstes Bild wird ganz normal in dein HTML eingefügt und ein Link zugewiesen.

    Dann schreibst du ein Classe, in etwa so...

    .bildtausch1:hover {   <!-- Nummer ist da, falls mehrere Bilder zum Einsatz kommen -->
    z-index:50; <!-- Muss nicht sein, kann angepasst werden -->
    height:483px; <!-- Muss nicht sein, kann angepasst werden -->
    width:400px; <!-- Muss nicht sein, kann angepasst werden -->
    cursor:pointer; <!-- Muss nicht sein, kann angepasst werden -->
    position:relative; <!-- Muss angepasst werden -->
    left: 10px; <!-- Muss angepasst werden -->
    top: 10px; <!-- Muss angepasst werden -->
    background:url(../Ordner/Bild1.jpg) <!-- Muss angepasst werden, Zielverzeichniss für das zweite Bild -->

    Jetzt nur noch diese Classe deinem Bild in HTML zuweisen

    <div class="bildtausch1">
    <a href="Link Adresse"><img src="dein Bild"/></a>
    </div>

    So könnte es funktionieren...