HTML+CSS+JS简单的方框移动

huai2325

于 2021-07-25 21:51:53 发布

阅读量806

点赞数

本文链接：https://blog.csdn.net/huai2325/article/details/119088479

版权

本文介绍如何使用HTML、CSS和JavaScript创建一个简单的动态方框，通过JavaScript实现方框在页面上的平滑移动，展示基础的前端交互效果。

摘要由CSDN通过智能技术生成

<!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>
</head>
<body>
    <div style="width:100px;height:100px;background-color:red;position:absolute;left:0;top:0;"></div>

    <script type="text/javascript">
        // 封装查询元素的样式函数，第一个参数是元素，第二个参数是样式类型
        function getStyle(elem, prop) {
            // 兼容性问题判断
            if (window.getComputedStyle) {
                // 不支持IE8及IE8以下的版本
                return window.getComputedStyle(elem, null)[prop];
            }else{
                // IE独有的
                return elem.currentStyle[prop];
            }
        }

        var div = document.getElemen

最低0.47元/天解锁文章

huai2325

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
HTML+CSS+JS简单的方框移动

<!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>Do.
复制链接

扫一扫