追光灯式点击展开,好玩!
模拟舞台追光灯效果,按照指引手指拖动光圈,找到指定位置后点击文章收缩展开。
乐高这个是我们最常见的是圆形灯光黑色环境的追光灯排版效果。
现在大家使用i排版SVG编辑器的追光灯式点击展开的效果,追光灯的形状和环境颜色都可以自定义了。
比如心慕与你圆形红色渐变环境的效果:
如何设置不同形状颜色的追光灯呢?
i排版SVG编辑器的追光灯展开组合可以搞定。

我们将追光灯图的素材设置成不同颜色或者不同形状镂空的效果,然后上传素材就可以了。
更多细节,以好利来心形追光灯的效果为例,下面一起看下详细的制作教程吧。
详细教程:
工具:iPaiban Pro黑科技编辑器,网址:SVG.iPaiban.com
组合:追光灯+点击伸缩式展开
编号:11601(组合)
第1步:选择组合
登录 iPaiban Pro 黑科技编辑器后,点击编辑器左侧「组合」按钮,在「花样展开」分类中找到「追光灯+点击伸缩式展开」组合,或者在组合中直接搜索编号11601,点击选择。

在组合编辑模式中,分为展开前和展开后两块设置区域。展开前设置图片追光灯效果,展开后可以任意嵌套各种效果。
①点击「展开前」区域,在右侧点击「换图」按钮分别上传4张图片。
其中点击前前景图、点击前底图和点击后图片,3张图片尺寸保持一致。点击前前景图需要是透明或者半透明的。
点击前追光灯图默认为黑色圆形灯光。如需自定义上传灯光图,图片尺寸需为1080×1034像素,中间镂空区域大概为50×50像素。
「展开后」的内容支持嵌套各种组件,需要什么效果就在左侧「组件」分类中找到相应的组件拖动到组件位中,然后上传需要的素材即可。
添加组件位-拖动组件到组件位中-上传图片,每需要一个样式就按照这3步操作:
如果预览效果发现内容没有完全展开或者展开过长,可以通过「加减展开高度(px)」进行调整,输入负数为减小展开高度。
内容编辑完毕后,点击左上角「保存并退出」退出组合编辑模式回到编辑器主页面。
该效果暂不支持在编辑器预览,接着点击「同步至微信后台」同步到自己的公众号预览完整效果就可以了。
使用同步功能无需频繁在编辑器和微信后台切换,同步成功后可以立即扫描二维码查看。
如需局部导入可参考《iPaiban Pro小助手安装和使用教程》中导入功能的「导入代码」部分。
制作SVG交互图文认准 iPaiban Pro 黑科技编辑器,网址:SVG.iPaiban.com,复制网址在 PC 端 Chrome(谷歌)浏览器打开,即可注册,编辑器所有组件/组合现已全部支持免费试用了。
新用户在「新手礼包」可领取3天企业标准版会员免费商用,以及22个常用必备组
件的大礼包(1年)。随礼包附赠千元优惠券,每单最高立降500元

![]()
![]()
![]()
![]()
iPaiban 团队可提供运营服务、视频制作、GEO、创意策划、多种风格设计、SVG交互开发、加粉等服务,如需定制,请添加玉兔微信(ID:playhudong15)沟通咨询。