Анимация и клон js

Question

Анимация и клон js

Денис Шаповаленко Ученик (88), на голосовании 1 год назад

У меня есть такой код:
<!doctype html>
<html>
<head>
<style>
button
{
margin-top: 100%;
margin-left: 95%;
border-style: solid;
border-color: blue;
border-width: 3px;
background-color: red;
width: 80px;
height: 60px;
}

div
{
top: 100px;
left: 200px;
width: 200px;
height: 30px;
background: white;
border-style: solid;
border-color: black;
position: relative;
animation: palet 2s;
}

@keyframes palet
{
0% {left: 0px; }
50% {left: 200px;}
100% {left: 200px;}
}
</style>
</head>
<body>
<button class="button" onclick="myFunction()">clone</button>

<script>
var a = 1;

function myFunction() {
for (let i = 0; i < a; ++i){
const node = document.getElementById("cop");
const clone = node.cloneNode(true);
document.body.appendChild(clone);
}
a *= 2;
}
</script>
<div id="cop"></div>
</body>
</html>
Когда появляется новый блок, он появляется снизу предыдущего, как сделать так что бы он появллся сверху предыдущего?

Answer 1

Night Prowler Мудрец (15236) 1 год назад

document.body.insertBefore(clone, node)

Денис ШаповаленкоУченик (88) 1 год назад

Спасибо