案例教学 | i排版在图文里做了个「弹幕」交互效果!

原创 收藏 评论
举报 2022-01-07



前天直播分享给大家多图排版交互图文,想学更多知识的同学们可以预约下周三直播——红包案例分享


拆解


原文案例使用无缝图作为背景,弹幕为前景自动滚动,实现弹幕的交互效果。

????????弹幕动图演示????????


制作


1、添加组件:全能无缝图(10028),作为“弹幕”的背景,添加图片“无缝图”;


2、添加弹幕-向左滚动(10958),按顺序添加弹幕滚动图,调整每张滚动时间为3S;

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



导入公众号后台


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


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


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



完成预约后添加白露老师(微信 brandbailu)领取直播福利           

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

    评论

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

    评论

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

    推荐评论

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

    全部评论(0条)