Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Смена класса стиля у дивов в меню (https://javascript.ru/forum/dom-window/12802-smena-klassa-stilya-u-divov-v-menyu.html)

resono 03.11.2010 18:31

Смена класса стиля у дивов в меню
 
Здравствуйте!
Помогите, пожалуйста подправить код.

У меня на страничке есть меню, пункты находятся в диве. Я хочу чтобы при наведении курсора менялся стиль дива (заливка, стиль шрифта) на "onmouseover". А когда мышь убирают с данного дива, снова становился стиль "onmouseout".

Написала код, но почему-то не работает. Хочу разобраться

<html>
  <script>
     window.onload=f;

     function f(){
			var div=document.getElementsByTagName("div");
			for(i=0; i<div.length; i++){
				div[i].className("onmouseover","this.className='onmouseover';");
				div[i].className("onmouseout","this.className='onmouseout';");
			}
		}
     
   </script>

<style>
table {
width: 50%; 


}
.onmouseout {background-color:#F1F1F1; border:1px solid #000;}
.onmouseover {background-color:#F1B1B1; border:1px solid #FF0000;}
</style>
	

<table align="center">
 <tr>
  <td>
   <div class='onmouseout'> Первый </div>
   <div class='onmouseout'> Второй </div>
   <div class='onmouseout'> Третий </div>
 </td>
</tr>

</table>
</html>

exec 03.11.2010 18:49

var divs = document.getElementsByTagName("DIV");
for (var i = 0; i < divs.length; i++) {
	divs[i].onmouseover = function () {
		this.className = "onmouseover";
	};
	divs[i].onmouseout = function () {
		this.className = "onmouseout";
	};
}

resono 03.11.2010 18:58

Спасибо большое, Exec! :)

vladlen 11.11.2010 03:08

Есть CSS псевдокласс :hover испоьзуйте его. Че велосипед изобретать?

Gvozd 11.11.2010 03:17

vladlen,
насколько мне не изменяет память, данный псевдо-класс не во всех браузерах работает для элементов отличных от <A>

vladlen 11.11.2010 03:33

IE6 - не работает. А что мешает поменять DIV на A? Также есть обход проблемы обрамлением того что нужно условным комментарием для ИЕ6 и тегом А + тем же классом как у целевого тега. Метод говно, но если не знаешь как верстать нормально - самое оно. На велосипеде надо ездить, а не изобретать. 2011 год на подходе ;)

Gvozd 11.11.2010 04:08

Цитата:

Сообщение от vladlen
А что мешает поменять DIV на A?

семантическая верстка?
Цитата:

Сообщение от vladlen
акже есть обход проблемы обрамлением того что нужно условным комментарием для ИЕ6 и тегом А + тем же классом как у целевого тега. Метод говно, но если не знаешь как верстать нормально - самое оно.

это самое говенное решение из всех возможных.
Цитата:

Сообщение от vladlen
На велосипеде надо ездить, а не изобретать. 2011 год на подходе

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


Часовой пояс GMT +3, время: 00:07.