How to animate them

Question

Here I have a div #wrapper. I want to generate new div every time using JS width different color every time and also want to animate like marquee tool without using them. The animation should be continue infinite and it should not be ended. How can I do that please help me.

for(let i = 1; i < 10; i++) {
    let div = document.createElement('div');

    div.setAttribute('class', 'box');
    div.style.marginRight = '40px';

    let cont = document.getElementById('wrapper');

    cont.appendChild(div);
}

#wrapper {
    width: 99.6%;
    height: 100px;
    border: 4px solid black;
    display: flex;
    /* justify-content: center; */
    align-items: center;
}


.box {
    width: 50px;
    height: 50px;
    background-color: black;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Document</title>
</head>
<body>
    <div id="wrapper">

    </div>

    <script src="script.js"></script>
</body>
</html>

Does this answer your question? [Why is deprecated and what is the best alternative?](https://stackoverflow.com/questions/31951282/why-is-marquee-deprecated-and-what-is-the-best-alternative) — evolutionxbox, Jul 11 '23 at 12:14
No, Here I have 10 div and I want to generate elements like them with different color the generation should not have end while displaying the element moving towards left — Dinesh Chandra Pandey, Jul 11 '23 at 12:23

How to animate them

0 Answers0