killereks killereks - 1 year ago 70
jQuery Question

Cannot rotate on X Y Z axis at the same time

function loop(){
var XValue = $('#xval').val();
var YValue = $('#yval').val();
var ZValue = $('#zval').val();

transform: 'rotateX('+XValue+'deg)',
transform: 'rotateY('+YValue+'deg)',
transform: 'rotateZ('+ZValue+'deg)',



I have made a 3D model inside css but i have problem rotating it using jquery. It only listens to the last command with transform in it. Any suggestions ?

Answer Source

You can't have duplicate keys in an object. At best, you're just going to overwrite the previous value, not add to it. Join your rotations into a single string.

  transform: 'rotateX('+XValue+'deg) rotateY('+YValue+'deg) rotateZ('+ZValue+'deg)'