<div id="news_ramka"
onmouseover="document.getElementById('a1').style.color = 'red'"
onmouseout="document.getElementById('a1').style.color = 'blue'">
замена цвета текста
Доброго времени суток.
Люди помогите не знаю что делать (((
У меня есть div, в нём лежит картинка и текст.
Хочу что бы при наведении на этот див менялся цвет текста. Как это реализовать на js??
Везде пишут как допустим на ссылке цвет заменить, а тут надо связать, я так понимаю div и текст, а как это сделать не понимаю.
вот
<div id="news_ramka">
<img src="33.jpg" alt="" title="">
<div class="img_text">02.10.2010<br>
<a href="#">Жизнь</a><br>
Юрий Медведев<br>
"Жизнь"<br>
20.10 - 11.11
</div>
</div>
сделал в hover к .news_ramka background-image, картинка меняется (фон). color не прокатывает
Люди помогите не знаю что делать (((
У меня есть div, в нём лежит картинка и текст.
Хочу что бы при наведении на этот див менялся цвет текста. Как это реализовать на js??
Везде пишут как допустим на ссылке цвет заменить, а тут надо связать, я так понимаю div и текст, а как это сделать не понимаю.
вот
<div id="news_ramka">
<img src="33.jpg" alt="" title="">
<div class="img_text">02.10.2010<br>
<a href="#">Жизнь</a><br>
Юрий Медведев<br>
"Жизнь"<br>
20.10 - 11.11
</div>
</div>
сделал в hover к .news_ramka background-image, картинка меняется (фон). color не прокатывает
Цитата: LM(AL/M)
вобще-то .news_ramka задает класс, а у вас id используется...
ну эт я тут не правильно написал, да #
ну тогда в определении стиля пишется так:
[highlight=css]
.img_text a:hover { /* a:hover без пробела! */
color: red;
}
[/highlight]
ну а как на js сделать подумайте сами )
[highlight=css]
.img_text a:hover { /* a:hover без пробела! */
color: red;
}
[/highlight]
ну а как на js сделать подумайте сами )
если я пропишу в
.img_text a:hover {
color: red;
}
то это будет распространятся только при наведении на текст, а мне надо что бы при наведении на <div id="news_ramka"> происходила смена цвета.
А с js у меня туговато, может подскажите, даже с чего начать не знаю ((
.img_text a:hover {
color: red;
}
то это будет распространятся только при наведении на текст, а мне надо что бы при наведении на <div id="news_ramka"> происходила смена цвета.
А с js у меня туговато, может подскажите, даже с чего начать не знаю ((
максимум что я могу посоветовать на js -- это
здесь a1 -- это id ссылки
Код:
здесь a1 -- это id ссылки
так а как мне потом обработать эту а1 и её значение впихнуть в цвет дива с текстом??
это был пример как поменять цвет ссылки. аналогично можно поступить и с дивом, только там поиск будет не по id а по тэгу (getElementsByTagName или как-то так -- подробности читайте в мануалах)
[HTML]<div onmouseover="this.style.color='red'" onmouseout="this.style.color='black'">Текст 1</div>
<div onmouseover="this.style.color='green'" onmouseout="this.style.color='black'">Текст 2</div>
<div onmouseover="this.style.color='blue'" onmouseout="this.style.color='black'">Текст 3</div>[/HTML]
<div onmouseover="this.style.color='green'" onmouseout="this.style.color='black'">Текст 2</div>
<div onmouseover="this.style.color='blue'" onmouseout="this.style.color='black'">Текст 3</div>[/HTML]
А обязательно ли текст пихать в див?
Вне его тоже прокатит имхо.
[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<style type="text/css">
.news_ramka { width:200px; border:solid 1px #FF3300; }
.news_ramka:hover { background-color:#0099FF; color:#33FF00;}
.news_ramka:hover a {color:#FF0000;}
.news_ramka:hover a:hover {color:#003388; }
</style>
</head>
<body>
<div class="news_ramka" id="news_ramka">
d fsf sdfsdfdfsdfs dfd fsf
02.10.2010<br>
<a href="#">Жизнь</a><br>
Юрий Медведев<br>
"Жизнь"<br>
20.10 - 11.11
</div>
</body>
</html>
[/HTML]
Вне его тоже прокатит имхо.
[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<style type="text/css">
.news_ramka { width:200px; border:solid 1px #FF3300; }
.news_ramka:hover { background-color:#0099FF; color:#33FF00;}
.news_ramka:hover a {color:#FF0000;}
.news_ramka:hover a:hover {color:#003388; }
</style>
</head>
<body>
<div class="news_ramka" id="news_ramka">
d fsf sdfsdfdfsdfs dfd fsf
02.10.2010<br>
<a href="#">Жизнь</a><br>
Юрий Медведев<br>
"Жизнь"<br>
20.10 - 11.11
</div>
</body>
</html>
[/HTML]
Ну по теме тут уже ответили, не по теме:
1) .news_ramka - руки оторвал бы за такие имена
2) Учитесь писать <br/>, а не <br> (т.е. выносить на уровень привычки)
1) .news_ramka - руки оторвал бы за такие имена
2) Учитесь писать <br/>, а не <br> (т.е. выносить на уровень привычки)
Цитата: UAS
Ну по теме тут уже ответили, не по теме:
1) .news_ramka - руки оторвал бы за такие имена
2) Учитесь писать <br/>, а не <br> (т.е. выносить на уровень привычки)
1) .news_ramka - руки оторвал бы за такие имена
2) Учитесь писать <br/>, а не <br> (т.е. выносить на уровень привычки)
а есть принципиальная разница как писать <br> или <br/>???
P.S. раз уж начали не по теме
Цитата: Kesano
А обязательно ли текст пихать в див?
Вне его тоже прокатит имхо.
[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<style type="text/css">
.news_ramka { width:200px; border:solid 1px #FF3300; }
.news_ramka:hover { background-color:#0099FF; color:#33FF00;}
.news_ramka:hover a {color:#FF0000;}
.news_ramka:hover a:hover {color:#003388; }
</style>
</head>
<body>
<div class="news_ramka" id="news_ramka">
d fsf sdfsdfdfsdfs dfd fsf
02.10.2010<br>
<a href="#">Жизнь</a><br>
Юрий Медведев<br>
"Жизнь"<br>
20.10 - 11.11
</div>
</body>
</html>
[/HTML]
Вне его тоже прокатит имхо.
[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<style type="text/css">
.news_ramka { width:200px; border:solid 1px #FF3300; }
.news_ramka:hover { background-color:#0099FF; color:#33FF00;}
.news_ramka:hover a {color:#FF0000;}
.news_ramka:hover a:hover {color:#003388; }
</style>
</head>
<body>
<div class="news_ramka" id="news_ramka">
d fsf sdfsdfdfsdfs dfd fsf
02.10.2010<br>
<a href="#">Жизнь</a><br>
Юрий Медведев<br>
"Жизнь"<br>
20.10 - 11.11
</div>
</body>
</html>
[/HTML]
спасибо за вариант, но мне нужно чтобы текст был справа от картинки (А обязательно ли текст пихать в див?)
Разница в том, что надо придерживаться стандартов xhtml. Все теги, не имеющие закрывающих тегов (<br>, <hr>, <input>) должны быть закрытыми - для этого пишут /> в конце них вместо >
Вообщем, так писать "принято". <br> тоже сработает как и надо, но это не по правилам.
Вообщем, так писать "принято". <br> тоже сработает как и надо, но это не по правилам.
спасибо буду знать
Вадим, для того чтобы текст обтекал картинку, достатчно картинке присвоить align. Ну и vspace, hspace чтоб выглядело красиво. Див для этогоиспользовать не обязательно.
Таким образом вы не обременяете себя подключением к этому делу жаваскрипта.
Таким образом вы не обременяете себя подключением к этому делу жаваскрипта.