![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
前端内容
Libra0809
Stay hungry,stay foolish.
展开
-
利用Transition过渡完成手风琴菜单
## 效果预览 ## 案例分析 实现手风琴菜单最核心的部分就是鼠标移到某一个模块时,相应的里面的内容会展开,鼠标移开后,内容又会收回。这其中的原理就是将每个模块里面的内容的初始高度设置成零,然后鼠标移上去之后,通过过渡让高度缓慢地增加直至显示出所有内容,鼠标移开后,也是同样的通过过渡,再让高度逐渐地减小为零。 ## 相关代码 <!DOCTYPE html&g...原创 2019-07-15 11:25:32 · 434 阅读 · 0 评论 -
利用canvas实现炫酷的倒计时效果
1.效果预览(文章最后面有源码) 2.代码实现 2.1 简要分析 这个案例可以大概分成三步来实现:首先绘制出时间,然后根据时间的变动产生相应的彩色小球,最后让这些小球运动起来。 第一步:通过观察我们可以看到,这些时间都是用一个个小球拼出来的,所以我们采用的方法就是利用一个点阵来表示一个数字,例如数字0就可以用如下的点阵来表示,具体绘制的时候,在数字1的位置进...原创 2019-08-28 19:41:00 · 1562 阅读 · 0 评论