Jump to content
Search Community

Rotation in IE9 not the same as other browsers

brendynz test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Can anyone give me a clue as to why IE9 is rotating my SVG files differently than all other browsers? TransformOrigin doesnt seem to work the same (I have tried, %, pixels, and top), and it is going in different directions. The CodePen link should show the 3 lettter "A"s pointing to the left. But in IE9, they get squished and point down after a TweenMax.set call. Any thoughts? Thanks very much.

 

Also posted here in case CodePen doesnt allow IE9 viewing:

http://brendyn.com/test2/

See the Pen QErOYr by leisurelarry (@leisurelarry) on CodePen

Link to comment
Share on other sites

Also, try going into the source code of the svgs and add width and height attributes to the <svg>. I've heard that helps in some cases.

 

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 134.2 215.2" style="enable-background:new 0 0 134.2 215.2;" xml:space="preserve">
<style type="text/css">
.st0{font-family:'MyriadPro-Regular';}
.st1{font-size:309.0591px;}
</style>
<text transform="matrix(0.5862 0 0 1 12 211.04)" class="st0 st1">A</text>
</svg>

Just want to eliminate  as many options as possible as its very unlikely this is related to GSAP or its something GSAP can fix.

  • Like 1
Link to comment
Share on other sites

Weird, it seems a previous response of mine disappeared.

 

Welcome to the forums, and thanks for the demo.

 

Please try doing that rotation with a CSS -ms-transform: rotate(-90deg); or plain JS. I'm really doubtful this is related to GSAP. Our CSSPlugin just sees you are rotating a div, it really has no idea you are using an SVG background. I'm doubtful there's anything in GSAP that can fix this. Seems like a rendering glitch in IE9.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...