Untitled

document.addEventListener("DOMContentLoaded",function(){

    var kvadrat1 = document.getElementById("kvadrat1");
    kvadrat1.addEventListener("click",function(){
        var promjena=0;
        var intervalId=setInterval(animacija,10);
        function animacija(){
            if(promjena==360){
                clearInterval(intervalId);

            }
            else{
                promjena++;
                kvadrat1.style.top = promjena + "px";
                kvadrat1.style.left = promjena + "px";
                kvadrat1.style.backgroundColor = "hsl("+ promjena +",100%,50%)";
                kvadrat1.style.transform = "rotate(" +promjena+ "deg)";
            }
         }
    });

    var kvadrat2 = document.getElementById("kvadrat2");
    kvadrat2.addEventListener("click",function(){
        let randomvarijabla = (Math.random() * 360).toFixed(0);
        var intervalId=setInterval(animacija,10);
         function animacija() {
      kvadrat2.style.top = randomvarijabla + "px";
      kvadrat2.style.left = randomvarijabla + "px";
      kvadrat2.style.backgroundColor = "hsl(" + randomvarijabla + ",100%,50%)";
      kvadrat2.style.transform = "rotate(" + randomvarijabla + "deg)";
      clearInterval(intervalId);
    }
  });
});