I want to rotate a "div" randomly, when i click a button

Question

"Pijl" is the div I want to rotate randomly. "Knop" is the button that is needed to make the div rotate.

var pijl = document.querySelector("#arrow");
var knop = document.querySelector("#bottom");
var spin = Math.round(Math.random() * (360));

knop.addEventListener("click", draai);
function draai(evt) {
   pijl.rotate(spin + "deg");
}

Possible duplicate of [Rotate a div using javascript](http://stackoverflow.com/questions/19126432/rotate-a-div-using-javascript) — madox2, Feb 24 '16 at 17:35

score 3 · Accepted Answer · edited May 23 '17 at 11:50

There is no rotate() method, you need apply the css style property instead. You can refer the following question : How to set the style -webkit-transform dynamically using JavaScript? or Rotate a div using javascript. Also you need to move the variable spin inside the function if you want to generate random values on each click.

var pijl = document.querySelector("#arrow");
var knop = document.querySelector("#bottom");

knop.addEventListener("click", draai);

function draai(evt) {
  var spin = Math.round(Math.random() * (360));
  pijl.style.transform = 'rotate(' + spin + 'deg)';
}

<div id="arrow" style="margin:50px;width:50px;height:20px;background:red">arrow</div>
<button id="bottom">click</button>

@PabloRotesSchnieders : glad to help – Pranav C Balan Feb 24 '16 at 17:44 — Pranav C Balan, Feb 24 '16 at 17:44

I want to rotate a "div" randomly, when i click a button

1 Answers1