I'm trying to use CSS3 animation markup to generate a nice smooth arc (rather than connect the dots). A technique for doing this that seems to work in webkit browsers is to transform the x and y axis independently with nested divs
As described here: http://coding.smashingmagazine.com/2011/09/14/the-guide-to-css-animation-principles-and-examples/
<divid="item-y"style="background-color:yellow; height:50px; width:
50px; position:absolute; left:300px; top:300px;"></div>
...And then have separate keyframes for item-x and item-y.
This technique doesn't seem to work on my Win8 Metro app or IE10. Works fine on chrome/webkit. Any thoughts on why not, and any alternatives?
That article is specific for webkit browsers. For example, all of the code has this:
You should modify your code to use the -ms prefix ala:
If that does not work you will need to post a sample of the CSS and HTML you are using.
Jeff Sanders (MSFT)
Yup, i had modified code to -ms prefix from everything in the example.
I talked to someone on the team and they told me this bug is fixed in the Feb 29 build.
Microsoft is conducting an online survey to understand your opinion of the Msdn Web site. If you choose to participate, the online survey will be presented to you when you leave the Msdn Web site.
Would you like to participate?