How to dynamicaly rotate html element using css or jquery

Question

Vijay Shukla · Answer

Hi John!You can try as belowHTML Code:andlt;bodyandgt;and  and  andlt;table cellpadding="15" cellspacing="15"andgt;and  and  and  and  andlt;trandgt;and  and  and  and  and  and  andlt;tdandgt;and  and  and  and  and  and  and  and  andlt;img src="http://www.mindstick.com/Employeesection/Image/Multi_purpose.png" id="imgTag"and  and  and  and  and  and  and  and  and  and  height="150px" width="150px" border="1" /andgt;and  and  and  and  and  and  andlt;/tdandgt;and  and  and  and  andlt;/trandgt;and  and  andlt;/tableandgt;and  and  andlt;br/andgt;and  and  and Rotate:and  and  andlt;input type="range" min="-360" max="360" value="0" onchange="rotator(this.value)" /andgt;andlt;br /andgt;and  and  Rotate image in andlt;span id="span1"andgt;Zero degandlt;/spanandgt;andlt;/bodyandgt;JavaScript Code:andlt;script type="text/javascript"andgt;and  and  and  and  function rotator(value) {and  and  and  and  and  and  document.getElementById('imgTag').style.webkitTransform = "rotate(" + value + "deg)";and  and  and  and  and  and  document.getElementById('imgTag').style.msTransform = "rotate(" + value + "deg)";and  and  and  and  and  and  document.getElementById('imgTag').style.MozTransform = "rotate(" + value + "deg)";and  and  and  and  and  and  document.getElementById('imgTag').style.OTransform = "rotate(" + value + "deg)";and  and  and  and  and  and  document.getElementById('imgTag').style.transform = "rotate(" + value + "deg)";and  and  and  and  and  and  document.getElementById('span1').innerHTML = value + " deg";and  and  and  and  }and  and  andlt;/scriptandgt;

forum

How to dynamicaly rotate html element using css or jquery

Anonymous User

Can you answer this question?

1 Answers

Liked By