Question

i am trying to rotate a div on y axis using transform but it is not supported in I.E so i used filter as follows

filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);

but still i cant only rotate it on y axis.. can anyone please help me to find a way to rotate it in I.E.. here is the code

$("#click").click(function() {
            $('div').animate({
                borderSpacing: -90
            }, {
                step: function(angle, fx) {
                    $(this).css('-webkit-transform', 'rotateY(' + angle + 'deg)');
                    $(this).css('-moz-transform', 'rotateY(' + angle + 'deg)');
                    $(this).css('transform', 'rotateY(' + angle + 'deg)');
                },
                duration: 'slow'
            }, 'linear');
        });
Was it helpful?

Solution

It looks like you are attempting to rotate around the Y axis, which is a 3D transformation. Unfortunately, progid:DXImageTransform.Microsoft.BasicImage (And progid:DXImageTransform.Microsoft.Matrix for that matter) do not support 3D transformations.

Your code should work in IE 10 and above, but you may need to add an additional css line in your step function for "-ms-transform".

I wish I could link to documentation regarding 3D transformations in IE but I have found very little of it myself.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top