超受欢迎的无限选择切换效果，看完这篇你就会做了！

原创赞收藏评论

举报 2023-10-11

扫描,分享朋友圈

啥是无限选择切换效果？

就是点击图文中特定的不同标签，切换对应的不同内容。如下：

组件：Apple同款-无限选择切换图片(五组及以上)

编号：11277（组件）

去年「Apple」公众号使用这种效果时，就曾为大家写过实现这种效果的教程。
现在一年过去了，无限选择切换效果热度不减，设定的标签也不再只有一行，选择切换的内容也不局限于单纯的图片，慢慢出现了滑动、视频号、小程序等交互。
两行选择标签的：

*素材来自德国唯宝餐具《推开理想生活之门》

组合：无限选择切换内容(五组及以上)

编号：11735（组合）

选择切换的内容为左滑的：

*素材来自ARMANI《EA7 网者之姿》

组件：Apple同款-无限选择切换图片(三组)+左滑

编号：11316（组件）

选择切换的内容为左滑和视频号的：

*素材来自捷豹路虎中国《请入座，赏巴蜀之声》

组合：无限选择切换内容(四组)

编号：11733（组合）

选择切换的内容为上滑的：

*素材来自路易威登《入旅南加州》

组合：无限选择切换内容(三组)

编号：11707（组合）

这些用 iPaiban Pro 黑科技编辑器都可以实现，下面教大家如何选择根据自己的需求选择合适的组件或组合，以及如何使用组合制作需要的效果。
如果选择切换的内容为纯图片、左滑或右滑效果，可以直接选用组件进行制作，操作上更为方便。
纯图片选择标签数支持2-5组及以上，左滑或右滑选择标签数最多支持5组，标签可以分行设计，在「点击」-「选择切换」分类中可以找到相应效果组件，教程：《Apple同款效果无限选择切换图片，来啦！》。

如果选择切换的内容为除了以上3种的其他效果，比如小程序、超链接、上滑、视频号等，则需要选用组合进行制作，当然切换的内容是以上3种效果也可以使用组合，组合的特点就是可以嵌套各种组件。
组合选择标签数支持2-5组及以上，标签可以分行设计，在「点击切换」分类中可以找到相应效果组合。

下面我们以前面「路易威登」3组标签，切换内容为上滑的效果为例，一起看下如何使用组合制作吧。

详细教程：

工具：iPaiban Pro 黑科技编辑器，网址：SVG.iPaiban.com

组合：无限选择切换内容(三组)

编号：11707（组合）

第1步：选择组合

第2步：进入组合编辑模式
点击「编辑组合」，进入组合编辑模式。
在组合编辑模式中，分为「背景图和选择图」、「结果内容」两块设置区域。

无限选择切换效果的素材主要分为3部分：背景图、选择图和结果图，顾名思义，在「背景图和选择图」区域中需上传背景图、选择图，在「结果内容」区域中上传结果图。

第3步：上传背景图和选择图
点击「背景图和选择图」区域，在右侧继续点击「换图」按钮上传1张背景图。背景图尺寸为单组选择图和结果内容尺寸之和。

为方便后面在背景图上设置触发区域，背景图上最好设计有选择标签。
点击「+」号上传多张选择图。选择图为设计有选择标签的图片，各个选择图尺寸需一致。

第4步：设置触发区域
双击编辑区上传的背景图，会出现一个触发区域调整窗口。触发区序号为几即代表第几张选择图，用户点击该序号所在位置便会显示该选择图，同时下方切换对应的结果内容。

触发区间不可重叠，调整触发区到合适位置后，一定点击「保存设置并退出」才算设置成功。

第5步：设置结果内容
因为我们选择的是三组的，所以「结果内容」区域共有3个大组件位，每一个大组件位对应一个选择后的结果内容。
在大组件位中点击「增加·槽」即添加了一个小组件位，此时我们就可以拖动左侧需要的组件到小组件位中，一个大组件位中可以添加多个小组件位。

这里我们需要用到上滑效果，拖动「单层滑动-上滑(支持多张)」组件（编号：10200）到小组件位中：

拖动组件进来后按需上传图片，剩余结果内容按照同样流程设置即可。
注意结果图宽度需与选择图宽度一致，各个结果内容显示尺寸需一致，结果内容的顺序应与选择图上的图标顺序相对应。

第6步：导入公众号后台
内容编辑完毕后，点击左上角「保存并退出」退出组合编辑模式回到编辑器主页面。
继续点击最右侧「预览草稿」，效果满意后接着点击「同步至微信后台」就可以了。

使用同步功能无需频繁在编辑器和微信后台切换，同步成功后可以立即扫描二维码查看。
如需局部导入可参考：《iPaiban Pro小助手安装和使用教程》

制作SVG交互图文认准 iPaiban Pro 黑科技编辑器，网址：SVG.iPaiban.com，复制网址在 PC 端 Chrome（谷歌）浏览器打开，即可注册，编辑器1500+组件/组合现已全部支持免费试用了。

新用户在「新手礼包」可领取3天企业标准版会员免费商用，以及22个常用必备组件的大礼包（1年）。随礼包附赠千元优惠券，每单最高立降500元。