html中如何用js设置鼠标两秒不动,隐藏鼠标

JavaScript010

html中如何用js设置鼠标两秒不动,隐藏鼠标,第1张

<!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/htmlcharset=utf-8" />

<title>无标题文档</title>

<style type="text/css">

#demo1, #demo2 {

width:500px

height:300px

border:1px solid #CCC

}

#demo1 { background-color:#9FFmargin-bottom:10px}

#demo2 { background-color:#FFC}

</style>

<script type="text/javascript">

function showCoords(e, obj) {

var e = window.event || e

var arCoords = [e.clientX, e.clientY]

obj.getElementsByTagName('p')[1].getElementsByTagName('span')[1].innerHTML = 'X:' + arCoords[0] + ',Y:' + arCoords[1]

}

window.onload = function() {

document.getElementById('demo1').onmousemove = function(event) { showCoords(event, this)}

document.getElementById('demo2').onmouseover = function(event) { showCoords(event, this)}

}

</script>

</head>

<body>

<div id="demo1">

<p>mousemove测试</p>

<p><span>当前坐标:</span><span></span></p>

</div>

<div id="demo2">

<p>mouseover测试</p>

<p><span>当前坐标:</span><span></span></p>

</div>

</body>

</html>

通过这个 可以判断鼠标移动的情况。这样 你需要去监听 当前坐标的值 。

每几秒监听下值 是否变化,如果不变。

就用CSS样式

BODY{CURSOR: url('空白图片url')}

去把鼠标 换个图片。

用样式

<style type="text/css">

BODY{CURSOR: url('http://www.baidu.com/favicon.ico')}

</style>

<DIV onmouseover="document.getElementById('abc').style.display = 'block'" onmouseout="document.getElementById('abc').style.display = 'none'">

经过我这里

</DIV>

<DIV id="abc" onmouseover="this.style.display = 'block'" onmouseout="this.style.display = 'none'">

我本来是隐藏滴

</DIV>