好多品牌的图文排版，每次必用「点击伸开」的交互恶果。

但每次「点击伸开」的恶果并不十足交流。

此次向全国先容一种看似简便，但不同样的神态伸开恶果。来望望底下这些案例感受一下吧。

点击进取移出切换图片后伸开：

*素材来自沪上大姨《新品！维C天花板「超顶刺梨」登场！》

组合：点击进取移出切换图片+伸开(有触发区)

编号：10995（组合）

点击向下移出切换图片后伸开：

*素材来自深蓝汽车DEEPAL《深蓝汽车上海车展首秀，齐「秀」了些什么》

组合：点击向下移出切换图片+伸开(有触发区)

编号：10996（组合）

点击向左、向右移出切换图片后伸开：

*素材来自华洛芙Wellendorff《因爱动掸》

组合：点击向左移出切换图片+伸开(有触发区)

编号：10993（组合）

组合：点击向右移出切换图片+伸开(有触发区)

编号：10994（组合）

点击指定触发区，原来的图片不错从上、下、左、右四个成见移出，切换新的图片并自动伸开剩余的本体。

上述案例恶果使用 iPaiban Pro 黑科技裁剪器的对应组合即可兑现，相较于常见的点击切换图片，这种点击移出切换图片

的方式，给东谈主一种揭示要紧音书或本体的嗅觉。

四个成见的制作经由一致，均复旧开辟点击触发区域、图片的移出切换时长和图文的伸开时长。

以第1个沪上大姨的案例为例，一齐来望望这个恶果是何如制作的吧。

详备教程：

器用：iPaiban Pro 黑科技裁剪器，网址：SVG.iPaiban.com

组合：点击进取移出切换图片+伸开(有触发区)

编号：10995（组合）

第1步：聘请组合

登录 iPaiban Pro 裁剪器后，点击裁剪器右侧「组合」按钮，在「神态伸开」-「切换图片+伸开」分类中找到「点击进取移出切换图片+伸开(有触发区)」组合，无意奏凯在搜索框中搜索组合编号10995，点击聘请。

第2步：投入组合裁剪模式

点击「点击此处确立」，投入组合裁剪模式。

在组合裁剪模式中，分为伸开前和伸开后两块开辟区域。

第3步：开辟「伸开前」本体

①上传图片：点击「伸开前」区域，在右侧点击2个「换图」按钮，别离上传准备好的「点击前」和「点击后」的图片。两种图片尺寸需保握一致。

②调换触发区域：双击「伸开前」区域图片闪现触发区域，拖动红色色块调换触发区域。（触发区不淡薄十足逼近图片旯旮，不然可能影响触发）

第4步：开辟「伸开后」本体

「伸开后」的本体复旧嵌套多样组件，需要什么恶果就在左侧「组件」分类中找到相应的组件拖动到组件位中，然后上传需要的素材即可。

添加组件位-拖动组件到组件位中-上传图片，每需要一个模式就按照这3步操作：

第5步：开辟参数

点击右侧红色小三角，不错开辟切换时长和伸开时长。

「切换时长」指令击后图片移出切换的技术。「伸开时长」即图文全部伸开浮滥的时长。

要是预览恶果发现本体莫得十足伸开无意伸开过长，不错通过「加减伸开高度（px）」进行调换，输入负数减小伸开高度。

第6步：导入公众号后台

本体裁剪结束后，点击左上角「保存并退出」冉冉退出组合裁剪模式回到裁剪器主页面。

延续点击最右侧「预览草稿」，恶果餍足后接着点击「同步至微信后台」就不错了。