Сообщение от poweroff
|
Здраствуйте.
Только начинаю изучать JS, вот написал небольшой скрипт и стразу столкнулся с непреятностью.
<html>
<head>
<script type="application/x-javascript">
function clk() {
alert(event.offsetX);
}
</script>
</head>
<body>
<form>
<input type="button" name="but" value="click" id="but" onclick="clk()">
</form>
</body>
</html>
К сожелению этот скрипт у меня работает только в opera.10, так же узнал что использования event не рекомендуется уже. Вопрос, как кросбраузерно узнать координаты курсора в нутри объекта?
|
nu vopervix object event ponimaet tolko IE, a ostalnie neznayut,ya privedu primer kak krosbrauserno reshit etu problemu :
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>javascript</title>
<style type="text/css">
#result{
background:#2AF06C;
margin-left:1500px;
width:300px;
padding:20px;
position:absolute;
}
*{
cursor:crosshair;
}
</style>
<script type="text/javascript">
window.onload=function ()
{
var img=document.getElementById("img");
/*dvijenie mishki*/
img.onmousemove = foo;
/*najatie mishki*/
img.onmousedown = foo;
/*rasjatie mishki*/
img.onmouseup = foo;
/*najatie klavishi*/
img.onkeydown = foo;
/*rasjatie klavishi*/
img.onkeyup = foo;
}
function foo(evt)
{
if(!evt) evt = event;
var result=document.getElementById("result");
result.innerHTML =
"x: " + evt.x + "<br>"+
"y: " + evt.y + "<br>"+
"clientX: " + evt.clientX + "<br>"+
"clientY: " + evt.clientY + "<br>"+
"offsetX: " + evt.offsetX + "<br>"+
"offsetY: " + evt.offsetY + "<br>"+
"screenX: " + evt.screenX + "<br>"+
"screenY: " + evt.screenY + "<br>"+
"button: " + evt.button + "<br>"+
"keyCode: " + evt.keyCode + "<br>"+
"altKey: " + evt.altKey + "<br>"+
"shiftKey: " + evt.shiftKey + "<br>"+
"ctrlKey: " + evt.ctrlKey + "<br>"/* +
"srcElement: " + evt.srcElement.tagName; */
}
</script>
</head>
<body>
<h1>privet</h1>
<div id="result">234</div>
<img src="images/1.jpg" id="img">
</body>
</html>