Блог

Главная - Вопросы по программированию - Эффект опрокидывания изображения CSS

Эффект опрокидывания изображения CSS

#html #css #graphics #web

#HTML #css #графика #веб

Вопрос:

У меня есть следующий CSS в попытке создать эффект опрокидывания:

 #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;
    }

И позже, тег div:

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

Однако, когда моя мышь перемещается по изображению, это не меняет фоновое положение ссылки. Мысли?

Комментарии:

1. Демонстрация: jsfiddle.net/SebjX

Ответ №1:

Добавить background-repeat: no-repeat к #arrow a .

Ответ №2:

Он работает, но ваш фон повторяется, поэтому может показаться, что он вообще не работает. Так что либо установите no-repeat или для фонового повтора, либо просто снимите настройку URL, а затем добавьте его только в hove

Метки: