Пример 13.17. Отслеживание положения мыши
<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN»>
<HTML>
<HEAD>
<TITLE>Слежение за мышью</TITLE>
<STYLE type = "text/css">
.category {font-weight: bold}
.value {font-family: "courier new"}
</STYLE>
<SCRIPT type = "text/javascript">
function move(){
//Записываем в элементы страницы текущее значение
//координат указателя мыши scr.innerText = event.screenX + "x" + event.screenY;
wnd.innerText = event.clientX + "x" + event.clientY;
element.innerText = event.offsetX + "x" + event.offsetY;
prnt.innerText = event.x + "x" + event.y;
//Индикация состояния мыши switch (event.button){
case 0: mouse.innerText = "0|0|0"; break;
case 1: mouse.innerText = "1|0|0"; break;
case 2: mouse.innerText = "0|0|1"; break;
case 3: mouse.innerText = "1|0|1"; break;
case 4: mouse.innerText = "0|1|0"; break;
case 5: mouse.innerText = "1|1|0"; break;
case 6: mouse.innerText = "0|1|1"; break;
case 7: mouse.innerText = "1|1|1"; break;
}
}
</SCRIPT>
</HEAD>
<BODY onMouseMove = "move()">
<DIV style = "border-style: solid; border-width:1px; width: 50%;
position: absolute; left: 50%; background-color: yellow; padding: 2mm">
<SPAN class = "category">Экранные координаты: </SPAN>
<SPAN class = "value" id = "scr"></SPAN><BR>
<SPAN class = "category">Оконные координаты: </SPAN>
<SPAN class = "value" id = "wnd"></SPAN><BR>
<SPAN class = "category">Относительно элемента: </SPAN>
<SPAN class = "value" id = "element"></SPAN><BR>
<SPAN class = "category">Относительно родителя: </SPAN>
<SPAN class = "value" id = "prnt"></SPAN>
<P><SPAN class = "category">Кнопки мыши (л|c|п): </SPAN>
<SPAN class = "value" id = "mouse"></SPAN>
</DIV>
<H1>Заголовок</H1>
<P>Содержимое страницы…
</BODY>
</HTML>
HTML: Популярный самоучитель
·
Александр Чиртик