前端案例-11 移动天使案例

最新推荐文章于 2023-07-21 17:18:32 发布

KathyLJQ

最新推荐文章于 2023-07-21 17:18:32 发布

阅读量132

点赞数

分类专栏：前端案例

本文链接：https://blog.csdn.net/kathyljq/article/details/115601725

版权

前端案例专栏收录该内容

32 篇文章 3 订阅

订阅专栏

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>

    </style>
</head>

<body>

</body>
<script>
    bd = document.querySelector('body');
    bd.style.position = 'relative';
    var angel = document.createElement('img');
    angel.style.position = 'absolute';
    angel.src = "images/angel.gif";
    bd.appendChild(angel);
    document.addEventListener("mousemove", function(e) {
        console.log(e.pageY);
        console.log(e.pageX);
        angel.style.top = e.pageY - 40 + "px";
        angel.style.left = e.pageX - 50 + "px";

    })
</script>

</html>