HTML Code Mauszeiger berührt Bild, dann dreht es sich

    Und wenn du mehrere Bilder hast die das benutzen sollen, was ich einfach mal annehme... machs doch gleich so:

    CSS

    HTML

    HTML
    <a href="#" class="foto" >
    <div class="foto" style="background-image: url(http://www.pagedeluxe.de/userdaten/000013/05/bilder/11.jpg);">

    </div>
</a>

    Falls die Bilder auch noch unterschiedliche größen haben, musst du das eben auch direkt in den code reinbringen. Ist zwar nicht die "schönste" Methode, aber besser als für jedes foto 10 Zeilen in der css datei zu haben. Zusätzlich kann man dann diese Angaben per PHP dynamisch gestalten *g*.

    Also ich denke ich bin zu blöd dazu. Habe jezt eine leere Seite vor mir. Öffne es in HTML und gebe diesen Code ein und es geht nicht was ist jetzt wieder falsch. wie sieht der Code auf einer leeren HTMl Seite richtig aus.

    .foto1
    {
    width: 150px;
    height: 200px;
    background-image: url(http://www.pagedeluxe.de/userdaten/000013/05/bilder/11.jpg);
    background-repeat: no-repeat;

    }
    .foto1:hover
    {
    background-position: 0 -200px;
    }
    <a href="#" class="foto1">
    <div class="foto1">

    </div>
    </a>

    die trennung war absicht...

    das erste ist ein CSS code, den solltest am besten in eine andere .css datei reintun. Diese dann im head bereich einbinden...

    Beispiel:

    hover.html


    hover.css