A
A
Alexander Polikarpov2014-04-05 19:29:12
css
Alexander Polikarpov, 2014-04-05 19:29:12

Firefox slows down when rendering 3d css elements?

There is a block (id="universe"), on which there are 50 volumetric cubes (6 divs that form a cube using css). Using jQuery, the position of the mouse is tracked and the universe block is rotated to a certain angle. In all browsers except firefox, this animation behaves stably. Is it possible to somehow solve the problem of brakes?

var universe = $('#universe');
$ycenter = universe.height()/2;
$xcenter = universe.width()/2;
$("body").mousemove(function(e) {  
    universe.css({'-moz-transform':'rotatex(' + (e.pageY - $ycenter)/20 + 'deg) rotatey(' + (e.pageX - $xcenter)/20 + 'deg)', '-webkit-transform':'rotatex(' + (e.pageY - $ycenter)/20 + 'deg) rotatey(' + (e.pageX - $xcenter)/20 + 'deg)', 'transform':'rotatex(' + (e.pageY - $ycenter)/20 + 'deg) rotatey(' + (e.pageX - $xcenter)/20 + 'deg)'});

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question