覆盖盖盖盖盖盖盖盖盖盖滑动来了!

原创 收藏 评论
举报 2024-06-14


先左滑,再右滑,来回重复滑动几次:

 1.gif


*素材来自淘宝《淘宝一千零一店,盛大开张!》

组件:层层滑开(左右交错,首层向右,自动对齐)+无缝图

编号:10489(组件)


这种层层滑开的效果想比大家印象深刻,非常适合拨开人群、云雾、谣言等创意排版。


另外还有单向层层滑开的,比如坦克SUV这篇,连续向左滑动试试:

2.gif

*素材来自坦克SUV《一起“趣”吗》

组件:层层滑开(单向左滑,首层向左,自动对齐)+无缝图

编号:10432(组件)

组件:遮罩

编号:10829(组件)



见惯了层层滑开的效果,今天再向大家展示一下它的相反效果——覆盖滑动,再次连续向左滑动:

 3.gif


*素材来自坦克SUV《一起“趣”吗》

组件:覆盖滑动-左滑(自动对齐)

编号:11856(组件)

组件:遮罩

编号:10829(组件)


可以看出,覆盖滑动配合遮罩用作前景,与普通的左滑相比别有一番感觉。

因为它是每滑动一次覆盖一层,非常适合用作组句、拼图等创意,并且滑入的图片支持再次滑出,大家可以尝试创作。
在 iPaiban Pro 编辑器中搜索关键词「覆盖」可以看到更多方向的覆盖滑动效果。




以上方「覆盖滑动-左滑(自动对齐)」配合「遮罩」的效果为例,一起看下制作教程吧。



详细教程:
工具:iPaiban Pro 黑科技编辑器,网址:SVG.iPaiban.com

组件:覆盖滑动-左滑(自动对齐)

编号:11856(组件)组件:遮罩

编号:10829(组件)
第1步:选择组件
登录 iPaiban Pro 编辑器后,点击编辑器左侧「组件」按钮,在「滑动」-「覆盖滑动」分类中找到「覆盖滑动-左滑(自动对齐)」组件,或者直接搜索组件编号11856,点击选择。

第2步:上传图片
点击右侧「换图」按钮上传底图,点击「+」号批量上传准备好的滑动图。底图和所有滑动图尺寸需保持一致。

第3步:设置前景图
在左侧「组件」中搜索编号10829找到「遮罩」组件,点击选择。
「遮罩」组件图片高度为零,常用来做前边组件的前景。接着点击右侧「换图」按钮上传一张前景图,尺寸和前面的滑动图保持一致。

第4步:导入公众号后台
点击最右侧「预览草稿」扫码预览效果,效果满意后点击「同步至微信后台」同步到自己的公众号就可以了。

使用同步功能可以不用频繁在编辑器和微信后台切换,同步成功后可以立即扫码预览二维码查看。

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

    评论

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

    评论

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

    推荐评论

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

    全部评论(0条)