Google Plus计数器动画如何运作?

时间:2012-10-30 05:26:03

标签: javascript css google-plus google-plus-one

有人知道Google Plus的投票动画是如何运作的吗?

这就是我的意思:http://cl.ly/image/0h1l1a181j1O

1 个答案:

答案 0 :(得分:1)

通过逐步完成代码我可以告诉他们:

  1. 将该数字拆分为内联块元素
  2. 需要设置动画的部分(如果数字不是9,则为最后一个数字,如果为9则为整数),其高度设置为显式,其溢出设置为隐藏。
  3. 此新元素的内容设置为{number}< br> {number + 1}< br> {number}
  4. 此新元素的scrollTop属性已设置动画以创建滚动效果
  5. 效果结束后,他们会用新号码替换拆分元素。
  6. 我不确定这个元素的第3个数字是什么,可能会使向后滚动更容易。