jq练习 envent事件 pageX 跟随鼠标移动
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin:0;
padding:0;
list-style:none;}
.test{
height:500px;
width:800px;
margin:0 auto;
margin-top:100px;
background-color:gray;}
label{
border:1px solid;
position:relative;
top:100px;
left:100px;
}
</style>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<label>click me</label>
<div class="test"></div>
<script>
$(document).ready(function(e) {
$(".test").mousemove(function(e){
console.log(e.pageX+":"+e.pageY);
$("label").css({"left":e.pageX,"top":e.pageY});
});
});
</script>
</body>
</html>
文档来源:51CTO技术博客https://blog.51cto.com/u_15288038/3029475
页:
[1]