3 картинки, как смастерить?

[Quest182]

В общем нужно, чтобы в картинке была кнопка(картинка)-ссылка, которая при наведении+нажатии осветлялась. В интернете нашёл только вариант с бэкграундом. Получается основная картинка должна быть бэкграундом, а остальные 2(затемнённая и осветлённая) я не знаю как прилепить. Ещё эта кнопка должна находится в определённом месте, получается надо задать координаты. К сожалению мои познания в цсс не глубоки, поэтому прошу помощи. Как это реализовать?

[d0ublezer0]

спрайтами

[Quest182]

а поподробнее можно

[CEBEP]

Вот короче... Суть в том что дефолтное изображение совмещается с фоном а при наведении поверх появляется новое нужное нам...

Там всё прокомментировано, так что даже если не удастся во всём разобраться то адаптировать на свой ресурс, думаю, будет всё равно просто

[Quest182]

не работает, при открытии страницы виснет браузер

[d0ublezer0]

Гугл-то не работает?

Вот вам вариант.

[CEBEP]

ой, не то под тем именем залил... подправил.

[Serlutin]

Да человек спросил, о том как вообще можно отобразить стиль при наведении.

Для этого нужно использовать псевдокласс :hover, для того чтобы назначить стиль при наведении на кнопку, а :activе непосредственно при нажатии. Еще есть псевдокласс :focus он работает, когда кнопку выбрали с помощью клавиатуры.

Итак если у вас кнопка имеет класс, например, .button, то

дожно быть так

.button {background: #999 url(obychnaya_knopka.gif) no-repeat;}
.button:hover {background: #900 url(pri_navedenii.gif) no-repeat;}
.button:focus {background: #900 url(v_fokuse.gif) no-repeat;}
.button:active {background: #900 url(pri_nazhatii.gif) no-repeat;}

А спрайты - это техника, позволяющая вместо четырех разных изображений использовать одно, но большего размера, что хорошо сказывается на загрузке.