I'm hoping to find a way to incorporate 3D transformations by utilizing the accelerometer on mobile devices within the following JavaScript code. Any assistance is greatly appreciated!
$(document).mousemove(rotateScene);
});
function rotateScene(e) {
var horizontal = e.pageX / $(document).width();
var vertical = e.pageY / $(document).height();
$('.test').css({
'-webkit-transform': 'rotateX(' + (7 - (vertical * 14)) + 'deg) rotateY(' + (-10 + (horizontal * 20)) + 'deg)',
'-moz-transform': 'rotateX(' + (7 - (vertical * 14)) + 'deg) rotateY(' + (-10 + (horizontal * 20)) + 'deg)',
'-ms-transform': 'rotateX(' + (7 - (vertical * 14)) + 'deg) rotateY(' + (-10 + (horizontal * 20)) + 'deg)',
'-o-transform': 'rotateX(' + (7 - (vertical * 14)) + 'deg) rotateY(' + (-10 + (horizontal * 20)) + 'deg)',
'transform': 'rotateX(' + (7 - (vertical * 14)) + 'deg) rotateY(' + (-10 + (horizontal * 20)) + 'deg)'
});
}