"Bild ändern" - link beim hover der link die css

Habe ich diesen link : 

<a href = "" ><img src="images_cartographie/cartographie3_05.gif" width="207" height="47" alt=""></a></td>

und ich möchte, um das Bild zu ändern, wenn der Benutzer über den link, den ich getestet : 

#planification:hover{
background-image:"images_cartographie/cartographie3_03.gif";
}

aber das Bild ändert sich nicht, es wird ignoriert (getestet habe ich background-color funktioniert es (dann ist das problem nicht in url oder ...))

wenn ich das hintergrund-Bild ohne hover so :
es erscheint nicht : 

#planification{
background-image:"images_cartographie/cartographie3_03.gif";
}

NB : ich generiert die Seite mit photoshop

haben Sie keine Ahnung,

  • verwenden Sie hintergrund-Bild auf beiden #planification:{background-image:} und #planification:hover:{background-image:}
  • Ich bearbeitet die post
  • entfernen src aus img....
  • Wie Bild-hover in css?.
InformationsquelleAutor simonTifo | 2013-02-24
  1. 6

    Kann man komplett entfernen die img denn Sie fügen Sie den Effekt über CSS auf die a tag.

    HTML

    <a href="" class="image_link"></a>

    CSS

    .image_link{
    display:block;
    width:800px;
    height:600px;
    background:url('http://ferringtonpost.com/wp-content/uploads/2012/07/Responsibilities-of-Owning-a-New-Puppy-Photo-by-bestdogsforkids.jpg');
}

.image_link:hover {
    display:block;
    width:800px;
    height:600px;
    background:url('http://25.media.tumblr.com/tumblr_m4frqhdW0k1rwpusuo1_1280.jpg');
}

    JSFiddle.

    Beachten Sie, dass Sie müssen hinzufügen dispay:block/inline-block zu den a

    • vielen Dank, es funktioniert
    • +1 für JSFiddle
    InformationsquelleAutor Vucko
  2. 0

    Ich bin ein wenig verwirrt über Ihre Frage, aber es klingt wie Sie benötigen, um in zwei unterschiedliche Bilder. Es gibt da So ein Bild, wenn Sie mit der Maus über, und ein weiteres Bild, wenn Sie nicht. Sie setzen Sie einfach in einen anderen Pfad für die hintergrund-url auf hover. Auch, Sie sollten in ein Brett gif in deinem img-tag für die Abwärtskompatibilität.

    Sollten Sie auch ein self-closing tag /> für dein Bild. Der tag ist der Weg offen, dass du es gepostet hast.

    #planification
{
    background: url(images_cartographie/cartographie3_03.gif) 
}

#planification:hover
{
    background: url(images_cartographie/new_image_goes_here.gif) 
}

<a id="planification" href = "" ><img src="images_cartographie/blank.gif" width="207" height="47" alt=""/></a>
    InformationsquelleAutor Ben
Schreibe einen Kommentar