ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / JavaScript Events
7 сообщений из 7, страница 1 из 1
JavaScript Events
    #34586957
PhoenixNET
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
PhoenixNET
Гость
Хочу сделать обработку событий отдельно от html кода.
Вместо
Код: plaintext
1.
2.
<div id="left" onmouseover="fun1();" onmouseout="fun2();"></div>
<div id="right" onmouseover="fun1();" onmouseout="fun2();"></div>
получить в html
Код: plaintext
1.
2.
<div id="left"></div>
<div id="right"></div>

Обработку событий вынести в .js файл, но так, чтобы одно событие можно было вешать на несколько элеметов (на примере - в зависимости от наведённого блока менять его бекраунд, например). Как это сделать правильно?
На windows.onload вызываю функцию, но как при этом передать и id элемента, и его событие? Что-то я совсем запутался %)

--
$50 + $100 бесплатно для игры на PartyPoker.com
...
Рейтинг: 0 / 0
10.06.2007, 00:15
| Ответить | Цитировать | Написать  
JavaScript Events
    #34586997
PhoenixNET
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
PhoenixNET
Гость
Разобрался. Если кому интересно:

JavaScript
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
window.onload = function () { 
	check();
}

function check() {
	var el = document.getElementsByTagName('li');
	for (i= 0 ;i<el.length;i++) {
		el[i].onmouseover = showBg;
		el[i].onmouseout = hideBg;
	}
	function showBg(e) {
		evt = e || window.event;
		tgt = evt.target || evt.srcElement;
		tmp = tgt;
		if (!tgt.id) {
			tmp = tgt.parentNode;
		}
		tmp.style.backgroundImage = 'url(images/menu_bg.jpg)';
		tmp.style.backgroundPosition = 'right bottom';
		tmp.style.backgroundRepeat = 'no-repeat';
	}

	function hideBg(e) {
		evt = e || window.event;
		tgt = evt.target || evt.srcElement;
		tmp = tgt;
		if (!tgt.id) {
			tmp = tgt.parentNode
		}		
		tmp.style.background = 'none';
	}
}
HTML
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
			<ul>
				<li id="l1"><img src="images/in_yan.jpg" alt="Главная" /><a href="#">Главная</a></li>
				<li id="l2"><img src="images/in_yan.jpg" alt="Главная" /><a href="#">Главная</a></li>
				<li id="l3"><img src="images/in_yan.jpg" alt="Главная" /><a href="#">Главная</a></li>
				<li id="l4"><img src="images/in_yan.jpg" alt="Главная" /><a href="#">Главная</a></li>
				<li id="l5"><img src="images/in_yan.jpg" alt="Главная" /><a href="#">Главная</a></li>
			</ul>
Только проблема - утечка памяти в Опере. В IE вроде бы всё в порядке, ФФ вообще гладко всё отображает...

--
$50 + $100 бесплатно для игры на PartyPoker.com
...
Рейтинг: 0 / 0
10.06.2007, 04:34
| Ответить | Цитировать | Написать  
JavaScript Events
    #34586999
PhoenixNET
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
PhoenixNET
Гость
Вроде залатал.
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
	function cleanup(tmp) {
		if (tmp.removeEventListener)
		{
			tmp.removeEventListener('onmouseout', hideBg, false);
			tmp.removeEventListener('onmouseover', showBg, false);
		}
		else 
		{
			tmp.detachEvent('onmouseout', hideBg);
			tmp.detachEvent('onmouseover', showBg);		
		}
Функция вызывается в конце функций hideBg и showBg.
Буду рад отзывам и предложениям ;)

--
$50 + $100 бесплатно для игры на PartyPoker.com
...
Рейтинг: 0 / 0
10.06.2007, 05:04
| Ответить | Цитировать | Написать  
JavaScript Events
    #34587001
PhoenixNET
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
PhoenixNET
Гость
Осталась одна визуальная проблема - в Опере курсор над li постоянно в режиме wait. Переопределение не помогло.
Утро вечера мудренее %)

--
$50 + $100 бесплатно для игры на PartyPoker.com
...
Рейтинг: 0 / 0
10.06.2007, 05:11
| Ответить | Цитировать | Написать  
JavaScript Events
    #34587295
Alex_BBB
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Alex_BBB
Участник
PhoenixNETХочу сделать обработку событий отдельно от html кода.
Вместо
Код: plaintext
1.
2.
<div id="left" onmouseover="fun1();" onmouseout="fun2();"></div>
<div id="right" onmouseover="fun1();" onmouseout="fun2();"></div>
получить в html
Код: plaintext
1.
2.
<div id="left"></div>
<div id="right"></div>

Обработку событий вынести в .js файл, но так, чтобы одно событие можно было вешать на несколько элеметов (на примере - в зависимости от наведённого блока менять его бекраунд, например). Как это сделать правильно?
На windows.onload вызываю функцию, но как при этом передать и id элемента, и его событие? Что-то я совсем запутался %)

--
$50 + $100 бесплатно для игры на PartyPoker.com

А если так:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
function check() {alert('A!');}

window.onload = function () { 
	var left = document.getElementById("left");
	left.onclick=registration;

	var right = document.getElementById("right");
	left.onclick=registration;
}
...
Рейтинг: 0 / 0
10.06.2007, 17:03
| Ответить | Цитировать | Написать  
JavaScript Events
    #34587300
Alex_BBB
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Alex_BBB
Участник
(опечатка)
Т. е. вот так:

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
function check() {alert('A!');}

window.onload = function () { 
	var left = document.getElementById("left");
	left.onclick=check;

	var right = document.getElementById("right");
	left.onclick=check;
}
...
Рейтинг: 0 / 0
10.06.2007, 17:05
| Ответить | Цитировать | Написать  
JavaScript Events
    #34587773
PhoenixNET
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
PhoenixNET
Гость
Alex_BBB
Код: plaintext
1.
2.
	var right = document.getElementById("right");
	left.onclick=check;

Вероятно right.onclick?
Не совсем подходит. Мне нужно перебирать элементы <li> и в зависимости от mouseover/mouseout производить одну и ту же процедуру.
Вы предлагаете перебор по id, но их может быть 5, а может быть и 10 - не очень удобно получается.
А вот с оперой так проблема и осталась, wait cursor появляется после первого наведения на <li> и "крутится" себе всё время =) Esc не помогает...
...
Рейтинг: 0 / 0
11.06.2007, 10:35
| Ответить | Цитировать | Написать  
7 сообщений из 7, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / JavaScript Events
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
NoSQL.ru       Новости, Чат       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&gotonew=1&tid=1458133]:
 0ms
get settings:
 9ms
get forum list:
 12ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 164ms
get topic data:
 12ms
get first new msg:
 8ms
get forum data:
 3ms
get page messages:
 45ms
get tp. blocked users:
 1ms
others: 11ms
total:  271ms
созд. / загр.: 271ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]