黑马程序员技术交流社区
标题:
运行JS代码遇到的问题
[打印本页]
作者:
小天
时间:
2013-8-27 17:36
标题:
运行JS代码遇到的问题
图片的onclick事件和图片的onmousemove事件不能同时执行
<P><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<A >http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</A>">
<html xmlns="<A >http://www.w3.org/1999/xhtml</A>">
<head>
<title></title>
<script type="text/javascript">
document.onmousemove = initEvent;
function initEvent() {
var img = document.getElementById("img");
img.onclick = imgOnClick;
img.onmousemove = imgMouseMove;
}
function imgOnClick() {
var img = document.getElementById("img");
img.src = "/img/02.jpg";
}
function imgMouseMove() {
var img = document.getElementById("img");
var y = window.event.clientY;
var x = window.event.clientX;
if (x <= 681 && y <= 166) {
img.src = "/img/lt.jpg";
}
else if (x <= 681 && y <= 316) {
img.src = "/img/left.jpg";
}
else if (x <= 681 && y <= 466) {
img.src = "/img/lb.jpg";
}
else if (x <= 906 && y <= 166) {
img.src = "/img/rt.jpg";
}
else if (x <= 906 && y <= 316) {
img.src = "/img/right.jpg";
}
else if (x <= 906 && y <= 466) {
img.src = "/img/rb.jpg";
}
}
</script>
</head>
<body>
<p style="text-align:center;"><img src="/img/01.jpg" alt="" id="img" /></p>
</body>
</html>
</P>
复制代码
作者:
许庭洲
时间:
2013-8-27 19:08
IE中如果在body上添加onclick, onmousemove等事件响应,那么如果页面没有满,则“body” 中最后一个元素以下(横向不限制)"的部分是无法响应事件的,必须使用代码在document上监听那些事件,比如document.onmousemove = MovePic
欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)
黑马程序员IT技术论坛 X3.2