Как заставить 2 изображения появляться при наведении? - PullRequest
Новая
       26

Как заставить 2 изображения появляться при наведении?

0 голосов
/ 24 августа 2011

По сути, я хочу создать на своей веб-странице кнопку, которая при наведении курсора мыши на нее отображает два изображения, одно над другим. Предполагается, что нижнее изображение должно быть анимированным .gif, второе - .gif со словом («блог», «музыка» и т. Д.) Белого цвета и прозрачным фоном (так что .gif за ним может еще будет видно). Я пытался добавить слова поверх анимированного .gif, но его цветовая палитра не позволяет белый (только светло-серый, что недопустимо в соответствии с дизайном).

Я довольно новичок в html / css, так что, возможно, есть лучший способ сделать все это вместе.

1 Ответ

0 голосов
/ 24 августа 2011

Вы хотите иметь ссылку внутри. CSS должен быть следующим: 

div.background_image{
background: url('path/to_your/image.gif') no-repeat 0 0;
}
a.top_image:hover{
width: Xpx;
height: Xpx;
display: block;
background:transparent url('path/to_your/image.gif') no-repeat 0 0;
}

Сделайте размеры ссылки такими же, как ваш фоновый рисунок div. Должно быть хорошо идти. Это предполагает, что вы хотите, чтобы ваш div фонового изображения всегда присутствовал. : Hover - это то, что заставит изображение появиться на ролловере

...