首页 > 代码库 > 每天一个JavaScript实例-铺货鼠标点击位置并将元素移动到该位置
每天一个JavaScript实例-铺货鼠标点击位置并将元素移动到该位置
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>每天一个JavaScript实例-铺货鼠标点击位置并将元素移动到该位置</title>
<style>
#info{
width:100px;
height:100px;
background:red;
position:absolute;
top:0;
left:0;
}
</style>
<script>
window.onload = function(){
document.onclick = clickwhere;
}
function clickwhere(evt){
evt = evt || window.event;
var x =0;
var y = 0;
if (evt.pageX){
x = evt.pageX;
y = evt.pageY;
}else if(evt.clientX){
var offsetX = 0;
var offsetY = 0;
if(document.documentElement.scrollleft){
offsetX = document.documentElement.scrollLeft;
offsetY = document.documentElement.scrollTop;
}else if(document.body){
offsetX = document.body.scrollLeft;
offsetY = document.body.scrollTop;
}
x = evt.clientX + offsetX;
y = evt.clientY + offsetY;
}
var style = "left:" +x + "px;top:"+ y + "px";
var box = document.getElementById("info");
box.setAttribute("style",style);
}
</script>
</head>
<body>
<div id = "info">
</div>
</body>
</html>
每天一个JavaScript实例-铺货鼠标点击位置并将元素移动到该位置
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。