案例教学 | 像可可满分这样的「抽屉切换」效果这样做最简单！
前天直播分享给大家多图排版交互图文，想学更多知识的同学们可以点击预约下周三直播——红包案例分享。
拆解
原文案例使用点击-抽屉切换图片，实现点击后图片从下方抽出，并无限次往返的交互效果。
????????抽屉切换动图演示????????
制作
1、添加组件：点击-抽屉切换图片(无限次往返,有触发区,下)（11087），按顺序添加背景图和标签图（首图必须为背景图），并调整标签初始显示高度为70（刚好显示出完整标签）；
2、点击显示触发区域，双击调整，背景图的触发区域为「返回」，根据图片说明，将触发区域调整至图片中间位置即可；点击下一张，依次调整标签图的触发区域，最后隐藏触发区域；
3、点击右侧“预览草稿”，可初步预览草稿效果（以导入公众号后台预览效果为准）；
导入公众号后台
4、在iPaiban Pro编辑器后台完成SVG交互图文后，点击右侧“导入微信后台”→点击“复制”；
5、打开微信公众号后台新建图文，点击浏览器右上角iPaiban Pro 小助手图标→点击“导入代码”→粘贴代码→点击“清空导入”；
6、操作成功后，记得添加标题、封面和保存，最后发送到手机预览最终的效果。
完成预约后添加白露老师（微信 brandbailu）领取直播福利
本文系作者授权数英发表，内容为作者独立观点，不代表数英立场。
转载请在文章开头和结尾显眼处标注：作者、出处和链接。不按规范转载侵权必究。
转载请在文章开头和结尾显眼处标注：作者、出处和链接。不按规范转载侵权必究。
本文系作者授权数英发表，内容为作者独立观点，不代表数英立场。
未经授权严禁转载，授权事宜请联系作者本人，侵权必究。
未经授权严禁转载，授权事宜请联系作者本人，侵权必究。
本内容为作者独立观点，不代表数英立场。
本文禁止转载，侵权必究。
本文禁止转载，侵权必究。
本文系数英原创，未经允许不得转载。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权，侵权必究。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权，侵权必究。
评论
评论
推荐评论
暂无评论哦，快来评论一下吧！
全部评论（0条）