svg 简单仿 mac 最小化效果

2018-03-27 23:16:20 +08:00
 qiutianaimeili

做了一个简单的仿照 mac 最小化弹窗的效果,效果图如下:

主要思路就是运用 svg 遮罩,讲展开和收缩动画一分为二。

demo 地址:http://qiutianaimeili.com/html/page/2018/03/source/mac/example_1.html

文章地址:http://qiutianaimeili.com/html/page/2018/03/mlo8if7lag8.html

不过没有做出内容跟着一起扭曲的效果,所以和真正的效果还是有区别,看看各位大佬有没有见过那种内容跟着一起扭曲的网页效果,望指点指点。

2236 次点击
所在节点    分享创造
5 条回复
geying
2018-03-29 16:59:33 +08:00
看不懂啊....
qiutianaimeili
2018-03-29 17:05:55 +08:00
@geying 看不懂效果还是看不懂我讲的东西。。
geying
2018-03-29 17:23:50 +08:00
@qiutianaimeili 看不懂 svg,曲线啥的 哈哈哈 本来想研究一下的
qiutianaimeili
2018-03-29 17:32:02 +08:00
@geying 好吧,svg 做一些效果还是可以的,你也可以收藏一下,等到时候学到了再回过头来看看。
geying
2018-03-30 09:03:30 +08:00
@qiutianaimeili 已收藏

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/441959

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX