想把图文做成小剧场?用「连续点击切换图片」就搞定!

原创 收藏 评论
举报 2021-11-26


前天直播教大家做连续点击切换多张图片效果,没有听够的同学可以点击预约下一期直播——长屏滑动教学。

今天这篇文字教程,

总结了直播的操作要点,

来一起跟着练吧!

拆解


原文案例是通过使用无缝图和连续点击切换,实现剧情的展开和切换:

↑截图分别是点击切换前、切换中和点击切换后的效果↑


通过研究案例效果,确定使用组件:批量无缝图和连续点击-切换多张图片(设置触发区域)即可实现。



制作


1、登陆网址x.ipaiban.com打开iPaiban Pro SVG编辑器,添加组件::批量无缝图,添加图片“无缝图”;


2、点击此处配置后点击“展开前”;


3、点击图片上方,显示触发区域,双击图片调整触发区域,由于本组切换图的触发区域都在一个位置,所以调整首张图片的触发区域之后,直接点击“为所有图片的应用此配置”即可,之后记得隐藏触发区域;


4、点击右侧“预览草稿”,可初步预览草稿效果(以导入公众号后台预览效果为准);



导入公众号后台


5、在i排版编辑器后台完成SVG交互图文后,点击右侧“导入微信后台”→点击“复制”;


6、打开微信公众号后台新建图文,点击浏览器右上角iPaiban Pro 小助手图标→点击“导入代码”→粘贴代码→点击“清空导入”;


7、操作成功后,记得添加标题、封面和保存,最后发送到手机预览最终的效果。


本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
转载请在文章开头和结尾显眼处标注:作者、出处和链接。不按规范转载侵权必究。
本文系作者授权数英发表,内容为作者独立观点,不代表数英立场。
未经授权严禁转载,授权事宜请联系作者本人,侵权必究。
本内容为作者独立观点,不代表数英立场。
本文禁止转载,侵权必究。
本文系数英原创,未经允许不得转载。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权,侵权必究。

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    DIGITALING
    登录后参与评论

    评论

    文明发言,无意义评论将很快被删除,异常行为可能被禁言
    800

    推荐评论

    暂无评论哦,快来评论一下吧!

    全部评论(0条)