javascript 多个div同时移动

最新推荐文章于 2023-08-18 11:59:45 发布

浮生途

最新推荐文章于 2023-08-18 11:59:45 发布

阅读量1.5k

点赞数 1

分类专栏： JavaScript

本文链接：https://blog.csdn.net/jy123_123/article/details/89459496

版权

本文介绍了如何使用JavaScript实现网页中多个div元素的同时移动效果，包括动态改变样式和利用事件监听实现平滑移动，适用于网页交互设计和动态效果的创建。

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

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

<head>
    <meta charset="UTF-8">
    <title>练习</title>
    <style>
        div{
            width:100px ;
            height: 30px;
            background: red;
            margin: 10px;
        }
    </style>
    <script>
        window.onload=function (ev) {
            var oDiv=document.getElementsByTagName("div");

            for (var i=0;i<oDiv.length;i++){
                oDiv[i].timer=null;
                oDiv[i].onmouseover=function () {
                    startMove(this,400);
                };
                oDiv[i].onmouseout=function () {
                    startMove(this,100);
                }
            }

        };

        function startMove(obj,iTarget) {
            clearInterval(obj.timer);
            obj.timer=setInterval(function () {
              var sp

最低0.47元/天解锁文章

浮生途

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript 多个div同时移动

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>练习</title> <style> div{ width:100px ; heig...
复制链接

扫一扫

专栏目录