2011-10-27 3 views
2

je le CSS suivant dans la tentative de créer un effet de survol:image CSS Rollover Effet

#arrow { 
    position:absolute; 
    left:540px; 
    top:150px; 
    width:220px; 
    height:120px; 
} 
#arrow a{ 
    display: block; 
    width:220px; 
    height:120px; 
    text-decoration: none; 
    background: url("images/arrow.jpg"); 
    background-position: 0 -120px; 
    } 
#arrow a:hover { 
    background-position: 0 0; 
    } 

Et plus tard, la balise div:

<div id="arrow"> 
    <a href="/arrow/arrow.htm"></a> 
</div> 

Cependant, lorsque mes rouleaux de la souris sur l'image , cela ne change pas la position de fond du lien. Pensées?

+0

Démo: http://jsfiddle.net/SebjX/ –

Répondre

5

Ajouter background-repeat: no-repeat à #arrow a.

+0

Démo: http: // jsfiddle. net/SebjX/1 / –

0

Cela fonctionne, mais votre arrière-plan se répète, cela peut sembler ne pas fonctionner du tout. Donc, soit définir no-repeat ou pour la background-repeat ou simplement enlever le paramètre url et ensuite l'ajouter sur hove seulement