VPF::hover для div в IE - Форум программистов

alex77

Дата 10.3.2007, 10:35 (ссылка)

(нет голосов)

Загрузка ...

жывтоне чочо

Профиль
Группа: Участник
Сообщений: 52
Регистрация: 29.9.2006
Где: Екатеринбург

Репутация: нет
Всего: нет

Здравствуйте.
Как проще можно сделать, чтобы в IE при наведении курсора мыши на div у него менялся цвет фона?
<div onmouseover="..." onmouseout="..."> не подходит.
пока нашел такую реализацию

Код


<!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>
<style type="text/css">
div
{
    width: 200px;
    height: 200px;
    background: #ccf;
    behavior: url('h.htc')
}
div:hover
{
    width: 200px;
    height: 200px;
    background: #cfc;
}
</style>
<title>
IE hover
</title>
<meta http-equiv="Content-Type" content="text/html; charset=Windows-1251" />
</head>
<body>
<div>
IE hover
</div>
</body>
</html>

Файл h.htc

Код


<PUBLIC:COMPONENT>
<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="Hilite()" />
<PUBLIC:ATTACH EVENT="onmouseout"  ONEVENT="Restore()" />
<script LANGUAGE="JScript">
  var normalColor, normalSpacing;
  function Hilite()
  {
    runtimeStyle.background = "#cfc";
  }
  function Restore()
  {
    runtimeStyle.background = '#ccf';
  }
</SCRIPT>
</PUBLIC:COMPONENT>

Это сообщение отредактировал(а) alex77 - 10.3.2007, 10:47

S.A.P.

Дата 10.3.2007, 10:52 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Участник Клуба
Сообщений: 2664
Регистрация: 11.6.2004

Репутация: 8
Всего: 71

hover в IE работает только для ссылок с непустым атрибутом href. Можно капнУть в эту сторону, например проставить для ссылки display:block, чтобы эмулировать блочный элемент.

Sardar

Дата 10.3.2007, 17:40 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317

С единственным но, http://validator.w3.org вряд ли согласиться с такой вёрсткой smile

С другой стороны это ИМХО лучше чем onmouseover/onmouseout.

--------------------

Опыт - сын ошибок трудных © А. С. Пушкин
Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
Оценить мои качества можно тут.

SelenIT

Дата 11.3.2007, 03:44 (ссылка)

(нет голосов)

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 49
Всего: 401

Sardar, имхо, согласится, если внутри будут одни формально разрешенные span-ы (а не div-ы) и т.д. По крайней мере, с примером (из моей молодости;) вроде бы соглашается...

--------------------

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

AKS

Дата 11.3.2007, 09:08 (ссылка)

(нет голосов)

Загрузка ...

Участник форума

Профиль
Группа: Участник
Сообщений: 725
Регистрация: 20.9.2006

Репутация: 27
Всего: 52

Цитата(SelenIT @ 11.3.2007, 03:44

)

с примером ... вроде бы соглашается

А почему бы и не согласиться? Внутри <a> много чего допустимо:

Код


<a href='' title=''>
    <big></big>
    <b></b>
    <small></small>
    <em></em>
    <strong></strong>
    <code></code>
    <img src='' alt='' />
    <br />
    <span></span>
    <textarea rows='2' cols='2'></textarea>
    <label></label>
    <input type='text' />
    <button></button>
    <script src='' type='text/javascript'></script>
    <select>
        <option></option>
    </select>
</a>

- все в норме (XHTML 1.1). Можно еще чего-нибудь внутрь добавить - только лень. ;)
Но все же с behavior получится более гибкая конструкция, чем если бы div'ы заменять на тэг a, разве не так?

Код


<public:component lightweight='true'> 
<public:attach event='onmouseover' handler='Hilite' />
<public:attach event='onmouseout' handler='Hilite' />
<script type='text/jscript'>
/*<![CDATA[*/
function Hilite(){
    runtimeStyle.backgroundColor =
        (window.event.type == 'mouseover') ? '#cfc' : '#ccf';
}
/*]]>*/
</script>
</public:component>

Sardar

Дата 12.3.2007, 11:07 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317

Цитата(SelenIT @ 11.3.2007, 02:44

)

если внутри будут одни формально разрешенные span-ы

На что только не идут верстальщики, что бы лишний раз не использовать JS. Правда наглядней когда оно стилями, жаль парни из W3C очень медленно доходят до того, что народу нужно smile

--------------------

alex77

Дата 13.3.2007, 07:16 (ссылка)

(нет голосов)

Загрузка ...

жывтоне чочо

Профиль
Группа: Участник
Сообщений: 52
Регистрация: 29.9.2006
Где: Екатеринбург

Репутация: нет
Всего: нет

Так оставлю:

Код


<public:component lightweight='true'> 
<public:attach event='onmouseover' handler='Hilite' />
<public:attach event='onmouseout' handler='Hilite' />
<script type='text/jscript'>
/*<![CDATA[*/
function Hilite(){
    runtimeStyle.backgroundColor =
        (window.event.type == 'mouseover') ? '#cfc' : '#ccf';
}
/*]]>*/
</script>
</public:component>

Видимо более оптимально не сделать.
Всем спасибо.

12345c

Дата 13.3.2007, 15:52 (ссылка)

(нет голосов)

Загрузка ...

Круглый

Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 57
Всего: 101

Делают ещё через стиль с behavior. Тоже скрипт, только во внешнем файле и вызывается из стиля. http://js2.ru/example/JsPrimeryCode-43.htm

Добавлено @ 15:53
(подсветка текста, но меняется, естественно, на что угодно)

Это сообщение отредактировал(а) 12345c - 3.3.2008, 12:35

--------------------

Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »