制作简易的牛顿摆锤模型
作者:坚定的守猴
撰写时间:2019年1月20日
开发工具和关键技术:DW CSS3动画旋转和延迟
牛顿摆锤,一个有意思物理模型。下面用CSS3的动画来实现这有意义模型。
代码如下:
先看结构
结构就是简单的盒子嵌套,一层嵌一层。
再来看一下样式
上面是外层盒子样式
下面就是绳子和小球的样式
设置两边最外面的小球动画函数
下面是左边的小球模型的
右面小球模型的
关键就是要有那种摆锤的节奏感,实现的方式就是动画上面百分比的设置。抓住这点,一个简单的牛顿摆锤模型就实现了。