Войти

Показать полную графическую версию : Вопрос по ссылкам на фотки???

Bono
11-05-2006, 20:23
Други, подскажите!

Как сделать, чтобы ссылки на фотки (ссылки ввиде маленьких фоток) были черно-белыми, а при наведении на них мыши, они становились цветными. Видел такую штуку на каком-то сайте. Все фотки-ссылки черно-белые, а цветной становится та, на которую наводишь мышку.
Vlad Drakula
11-05-2006, 22:58
Bono
просто на JS либо подменяем картинку, либо просто меняем две картинки глубиной...
Bono
12-05-2006, 17:17
просто на JS либо подменяем картинку, либо просто меняем две картинки глубиной...
Vlad Drakula, а можно немного по подробнее, а то я пока не очень разбираюсь в этом. :)
Vlad Drakula
12-05-2006, 18:03
Bono
<img src="урла для обычного состояния" onmouseover="this.src='урла для наведенного состояния'" onmouseoге="this.src='урла для обычного состояния'"/>
dmitryst
12-05-2006, 18:06
Vlad Drakula не onmouseoге а onMouseOut
Vlad Drakula
12-05-2006, 18:19
dmitryst
ну... лписался чеголовек... каждый может... но веть ответ правильный?
Bono
12-05-2006, 19:34
Ура! Получилось! :clapping:

Vlad Drakula, большое спасибо за помощь!
dmitryst, спасибо за подсказку!

Подскажите, заодно, как сделать, чтобы ссылка при наведении мыши, тоже меняла цвет? ;)
Prisoner
13-05-2006, 13:30
Ссылки лучше сделать посредством псевдоселекторов CSS:
a.someName:link{
color: Blue;
text-decoration: underline;
}

a.someName:active {
color: Blue;
text-decoration: underline;
}

a.someName:hover {
color: Red;
text-decoration: underline;
}

И объявлять ссылку в виде
<a href="#" class="someName">someText</a>
dmitryst
13-05-2006, 14:18
Bono Ага, и таких стилей можно наплодить в нужном количестве, если надо.
Vlad Drakula я ж просто поправил :) предотвращая расход нервов Bono
Bono
13-05-2006, 16:55
Ссылки лучше сделать посредством псевдоселекторов CSS:

Код:
a.someName:link{
color: Blue;
text-decoration: underline;
}

a.someName:active {
color: Blue;
text-decoration: underline;
}

a.someName:hover {
color: Red;
text-decoration: underline;
}

А где все это писать? Я вписал в html-код страницы. И на самой странице появляется текст вышеуказанного кода и, естественно, ничего не работает?
dmitryst
13-05-2006, 17:07
Bono
Вроде, так:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Вопрос по ссылкам на фотки???</title>
<meta name="description" content="Вопрос по ссылкам на фотки???">
<meta name="keywords" content="Вопрос по ссылкам на фотки???">
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1251" />
<style>
a.someName:link{
color: Blue;
text-decoration: underline;
}

a.someName:active {
color: Blue;
text-decoration: underline;
}

a.someName:hover {
color: Red;
text-decoration: underline;
}
</style>
</head>
<body>
<a href="#" class="someName">someText</a>
</body></html>
Bono
13-05-2006, 20:11
Prisoner, спасибо за информацию!

dmitryst, огромное спасибо за более подробное пояснение! :)
А для чего нужны строки:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<meta name="description" content="Вопрос по ссылкам на фотки???">
<meta name="keywords" content="Вопрос по ссылкам на фотки???">
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1251" />


И без них все работает! :confused:
Vlad Drakula
14-05-2006, 07:27
Bono
А для чего нужны строки...
это уже отдельная тема, так что создай новый топик... там и получишь ответ!
dmitryst
15-05-2006, 12:39
Bono
1. Она вообще-то не очень нужна, просто описывает соответствие стандарту
2. Это слова для поисковых систем. Без них тоже заработает, просто я взял код этой страницы и почистил немного :)



© OSzone.net 2001-2012