HTML5中对层添加鼠标事件。

413 views

<!doctype html>
<html>
<head>
<meta charset=”utf-8″>
<title>手机网站</title>
<style>
body{font-size:82.5%;font-family:”Microsoft YaHei”,Arial; overflow-x:hidden; overflow-y:auto;}
.viewport{ max-width:750px; min-width:300px; margin:0 auto;}
#div1{background:url(../qieshuiguo/images/backgroundnew.jpg);
width:750px;height:1206px;
color:#FFF;
font-size:24px;};
</style>

</head>

<body>
<div id=”div1″>
大家好!我是沙子,欢迎光临淘沙网。
</div>
<script>
var canvas=document.getElementById(‘div1’);
canvas.onclick=function(e){//给canvas添加点击事件
e=e||event;//获取事件对象
// window.open(‘http://www.taoshaw.com’);//打开指定链接
window.alert(“欢迎光临淘沙网。”);
}
</script>
</body>
</html>

对于要添加鼠标事件的层级,要放在该DIV层级名称的下面。

<script>
var canvas=document.getElementById(‘div1’);
canvas.onclick=function(e){//给canvas添加点击事件
e=e||event;//获取事件对象
// window.open(‘http://www.taoshaw.com’);//打开指定链接
window.alert(“欢迎光临淘沙网。”);
}
</script>

鼠标经过,按下等代码。。

<script>
var canvas=document.getElementById(‘div1’);
canvas.addEventListener(“mousedown”,doMouseDown,false);
canvas.addEventListener(‘mousemove’, doMouseMove,false);
canvas.addEventListener(‘mouseup’, doMouseUp, false);
function doMouseDown(e){//给canvas添加点击事件
e=e||event;//获取事件对象
// window.open(‘http://www.taoshaw.com’);//打开指定链接
window.alert(“欢迎光临淘沙网。”);
}
function doMouseMove(e){
window.alert(“欢迎光临淘沙网。鼠标移动。”);
}
function doMouseUp(e){
window.alert(“欢迎光临淘沙网。鼠标抬起。”);
}
</script>

 

如果您觉得这篇文章对您有帮助,欢迎继续关注本站!!!我要赞助本站>>>

Leave a Reply

电子邮件地址不会被公开。 必填项已用*标注