Что б через стили "нажималась" кнопка

Статус
Закрыто для дальнейших ответов.

Evgen

Registered User
Топикстартер
15 лет на форуме
Сообщения
2 054
Реакции
984
В стилях определяю объект(картинку), на которую нужно нажать, что б пошла загрузка файла (в данном случае это аудиофайл.mp3)
Через псевдо-классы подсвечиваю рамку при наведении и добавляю смену картинки:
Код:
div.imgload { background:url(img/download_normal.gif); width:150px; height:23px; border: solid 1px #000; }
div.imgload:hover { border-color: #ff9; cursor:pointer }
div.imgload:active { background:url(img/download_pressed.gif) }
Пока пара вопросов:

1. Известная зараза IE не хочет показывать новую картинку (download_pressed.gif).
2. В мозилле после нажатия на картинку - если нажать, не отпуская утянуть курсор в сторону с картинки (чтобы не отработала ссылка) и отпустить - остается дрянь типа куска подчеркивания от ссылки. Как бы от этого избавиться...

Визуально должно работать так, как на нижней картинке: подвел - подсветилось, нажал/отпустил - после смены картинки вернулась первая. Но здесь не отрабатывает ссылка.
Страница с примером.

Уже мозг переклинило, не соображаю.
Заранее спасибо за советы и помощь.
 

faortto

Кто такой?
15 лет на форуме
Сообщения
2 764
Реакции
50
Ответ: Что б через стили "нажималась" кнопка

не очень понял в чем проблема, но можно сделать так

Код:
<style type="text/css">
.imgload {
background:url(img/download_normal.gif);
width:150px;
height:23px;
border: solid 1px #000;
display:block;
}

.imgload:hover {
background:url(img/download_pressed.gif)
border-color: #ff9;
cursor:pointer;
}
</style>

<a href="***.mp3" target="_blank" class="imgload"></a>

дивы там вообще лишние
 

Evgen

Registered User
Топикстартер
15 лет на форуме
Сообщения
2 054
Реакции
984
Ответ: Что б через стили "нажималась" кнопка

Предложение на практике не проверял, но судя по коду, смена картинки получается сразу при наведении мыши на эту область ( :hover ).
Это не есть гуд.
Ведь обычно чтобы что-то сработало (загрузка), нужно на него нажать.
Поэтому я хочу, чтобы картинка менялась в момент нажатия ( :active ). Так и в gmail сейчас организовано.
Да чтоб IE это показывал.

Насчет дивов - верно, не нужно.
(Насмотрелся всякого в инете.)


Update
Последнюю строку не заметил, извиняюсь, сейчас попробую.
 

Evgen

Registered User
Топикстартер
15 лет на форуме
Сообщения
2 054
Реакции
984
Ответ: Что б через стили "нажималась" кнопка

Действительно, перемудрил с дивами.
Спасибо, работает. ))
Вот только после клика по ссылке и увода фокуса в сторону от данного блока первоначальная картинка не возвращается, пока не ткнуть в другое место на странице. (С псевдо-классом " :visited " не работает.)
Хочется, что бы подмена фона работала так, как на нижней картинке (сейчас на ней правильно мою задумку показывает Firefox и Opera).
 
Статус
Закрыто для дальнейших ответов.