|
|
|||||
Регистрация: Oct 2007
Сообщений: 115
|
Динамическая смена класса
Как возможно поменять класс или его свойство при наведении мыши на какой-то div
<div class="c_content" onMouseOver="this.className='roll_content'" onMouseOut="this.className='c_content'"> Однако этот вариант не проходит валидацию. Можно это делать через свойство: Однако этот вариант не работает в IE. Однако валидно и в IE реализовано на сайте http://www.drive.ru/bmw/news/2008/06...oldovstva.html Помогите пожалуйста. |
|
|||||
Регистрация: Feb 2008
Сообщений: 42
|
Зачем тут вообще JS? не проще ссылку сделать блоком и установить в hover бэкграунд?
P.S. если не проще делается всё просто document.getElementById(id).style.background = 'red' |
|
|||||
Регистрация: Oct 2007
Сообщений: 115
|
Ваш второй вариант тоже не валиден, т.к. в нём надо на функцию всёравно ссылаться.
|
|
|||||
Регистрация: Feb 2008
Сообщений: 42
|
вопрос был "Как возможно поменять класс" вам ответили, через style, готовый когд по примеру преведённому вами приблезительно выглядит так:
<script language="javascript"> function redColBg(p) { bg = p.style bg.background = '#d00101' } </script> <div onclick="redColBg(this);"></div> |
|
|||||
Регистрация: Oct 2007
Сообщений: 115
|
Йожег:
Если вы внимательно читали мой пост, то там написано, что вариант с применением ссылки на javascript функцию из блока <div> не проходит валидацию. Это WC3 Validation. Вы ведь знаете о такой? |
|
|||||
Регистрация: Feb 2008
Сообщений: 42
|
Liox в вашем посте вы утверждаете что не валидно, и не работает то что вы написали с ошибками.
вот пример с моей последней работы, бэкграунд+прозрачность <style type="text/css"> .head, a.head:link, a.head:active, a.head:visited { width: 220px; float: left; height: 72px; margin: 10px 25px 0 0; display: block; opacity: 0.7; MozOpacity: 0.7; KhtmlOpacity : 0.7; filter: alpha(opacity=70); font: 13px/14px Tahoma; color: #000; background: red; } a:hover.head { opacity: 1; MozOpacity: 1; KhtmlOpacity : 1; filter: alpha(opacity=100); background: yellow; } </style> <body> <a class="head" href="#"><div class="headText">Информация <br>для всех</div></a> <a class="head" href="#"><div class="headText">Телефонный <br>справочник</div></a> <a class="head" href="#"><div class="headText">Поиск по сайту</div></a> </body> |
|
|||||
Регистрация: Oct 2007
Сообщений: 115
|
Да нет же вы всё опять не так поняли. Те способы что я выше указал, они в любом случае не подойдут. Их я привёл для того, чтобы показать, то чего я хочу добится и что мне явно не подходит. Мне нужен валидный код, и работа во всех браузерах.
То что вы предлагаете менять подсветку у текста, мне ведь не это надо. И при этом текст ещё создаёт анимацию руки(для нажатия на ссылку). Если бы вы потрудились перейти по ссылке, которую я предоставил, то увидели бы для чего используется изменение цвета фона. Кстати вашь пример совсем не правелен с позиции семантики. Блочные элементы не правильно заключать в строчные. Думаю что единственный действенный способ это применение *.htc только он сильно грузит проц, попробую немного изменить ето. Последний раз редактировалось Liox; 25.06.2008 в 16:06. |
|
|||||
Регистрация: Feb 2008
Сообщений: 42
|
P.S курсор меняется свойством cursor
приведённый на сайте пример - извращение, неужели такие лаги, загрузка проца стоят валидности которая по смыслу не отменяет кросбраузерность? Последний раз редактировалось Йожег; 25.06.2008 в 16:58. |
|
|||||
Регистрация: Oct 2007
Сообщений: 115
|
Приторможение конечно имеет место быть. Но только если у смотрящего ie 6.0. И тормознутый проц . Расчитывая на то что страницы у меня всётаки будут не такие обьёмные как на этом сайте. То это меньшее зло. Вобщем метод простой, просто нужно добавить следующее:
<![if lt IE 7]> <![if gte IE 5.5]> <link rel="stylesheet" href="ie6.css" type="text/css" media="screen" /> <![endif]> <![endif]--> И всё будет работать как надо. Скачать csshover.htc можно где угодно. В гугле очень много ссылок на него. |
|
|||||
.grin! wuz here
|
1) 1й вариант вполне себе валиден. тэг только закройте, да регистр весь в нижний.
2) http://www.artlebedev.ru/tools/techn...ml/css2_in_ie/ 3) по-хорошему нужно делать так (атрибуты в нижнем регистре): <div onmouseover="this.className += 'my_class';" onmouseout="this.className = this.className.split('my_class').join('');"></div> + тут наблюдается совершенно идиотское стремление к валидации ради самой валидации. вопрос на засыпку: на кой она вам, если работает и так и сяк?
__________________
Breakcore them all! Последний раз редактировалось KidsKilla; 26.06.2008 в 03:14. |
Часовой пояс GMT +4, время: 22:55. |
|
« Предыдущая тема | Следующая тема » |
Опции темы | |
Опции просмотра | |
|
|