|
Сообщение от Eadweard
|
|
остальные появляются, но не двигаются
|
потому что id уникально!!!
<!DOCTYPE HTML>
<html>
<head><meta charset="utf-8">
<title>Перемещение круга</title>
<style>
.svgcircle
{
position: absolute;
}
.circle
{
-webkit-transition: all 10s cubic-bezier(0, 0, 1, 1);
-moz-transition:all 10s cubic-bezier(0, 0, 1, 1);
-o-transition:all 10s cubic-bezier(0, 0, 1, 1);
transition:all 10s cubic-bezier(0, 0, 1, 1);
}</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
<script>
$("html").on("click", ".circle" , function()
{
this.setAttribute("cx",Math.random()*500)
this.setAttribute("cy",Math.random()*500)
$(this).clone().appendTo(".svgcircle");
})
</script>
<div class="container">
<div class="main">
<svg width ="600" height ="600" class="svgcircle">
<circle class="circle" cx="35" cy="25" r="20" fill="black"/></circle>
</svg>
</div>
</div>
</body>
</html>