css - CSS 中的 Win8 加载器动画

Question

我在 CSS 中制作了一个 Win8 加载器动画的副本(请参阅 JSFidle)，但感觉并不那么......像 windows。

@-webkit-keyframes win8-dot1 {
    0%   { left: -30px;  }
    26%  { left: 40.625%  }
    52%  { left: 56.25%;  }
    78%  { left: 98.83%; opacity: 1;}
    79%  { opacity: 0;}
    100% { left: 98.83%; opacity: 0; }
}

对于从26%到52%的动画，我认为属性left的变化应该更多。但如果我这样做，将其更改为 35% 到 60% 而不是 40.625% 到 56.25%，在 26% 内过渡到 52% 时，点之间的间距也会增加，这是我不想要的。 (而且我不明白为什么会这样)。

谁能想出更好的值(value)？

http://jsfiddle.net/nNfAy/

Answer 1

这是我发现并在我的网站上使用的 Win8 加载程序。

http://codepen.io/anon/pen/AoDei