I think this may be because the 0% and 100% are key words for the selectors and the css animation is confused? Its probably trying to find the selector -120%. But I am guessing here. Does look like others have run across this and determined it was a bug.
Karl DeSaulniers Design Drumm http://designdrumm.com On Aug 26, 2013, at 11:31 AM, Kuzeko Web Design - Matteo Lissandrini wrote: > Hi all, > > I am trying a simple animation: long text inside a box scrolling up. > Since I have multiple boxes they have different length, so I am trying to > use keyframe animation with top positioning with percent value. > > Please find an example here: > http://jsfiddle.net/sKEnv/1/ > > As you can see the first example is using em units and it works, the second > it uses percent values and it doesn't. > > Am I doing something wrong or is simply not possible to do this with > percent values? > > > > Thanks! > > > ------------------ > > Kuzeko > > > > On 2 October 2012 18:38, Gabriele Romanato <gabriele.roman...@gmail.com>wrote: > >> I generally tend to use CSS3 animations in mobile web apps whenever it's >> possible, but sometimes I get stuck when the app's requirements are too >> complex. So I usually mix up basic CSS3 animations with JS routines in >> order to not end up with messy markup as in many Codrops examples (you >> know, form elements used to create slideshow effects and so on). >> >> What I don't really know is if there's a common best practice to follow >> when creating complex web apps which feature a lot of advanced effects. >> CSS3 animations are faster than JS animations, but when your boss or your >> client has a Flash-like idea about how your effects should be made, well >> it's difficult to me to stick to pure CSS animations. >> >> What's your approach when you design complex web apps? >> I'd really like to get some hints about the role of CSS animations in that >> context. >> >> Thanks in advance. >> Gabriele >> >> >> ______________________________________________________________________ >> css-discuss [css-d@lists.css-discuss.org] >> http://www.css-discuss.org/mailman/listinfo/css-d >> List wiki/FAQ -- http://css-discuss.incutio.com/ >> List policies -- http://css-discuss.org/policies.html >> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ >> > ______________________________________________________________________ > css-discuss [css-d@lists.css-discuss.org] > http://www.css-discuss.org/mailman/listinfo/css-d > List wiki/FAQ -- http://css-discuss.incutio.com/ > List policies -- http://css-discuss.org/policies.html > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
