说到滑动，大家是不是脑海中第一想到的便是左右滑动图片？左右滑动展示图片是【滑动】最基础的效果，难道除了这个效果，【滑动】就一无是处了吗？非也，在【滑动】的基础属性上，我们还衍生出了其他效果组件：左右滑动模糊变清晰 | 黑白变彩色；滑动见底图；背景图固定前景自动居中双层滑动等，今天我们着重讲解这三个视觉效果都不错的组件。
估计有不少朋友说，你这个效果不就是放两张图，一张黑白一张彩色吗？这有什么难的。的确，实现这个效果我们可以准备一张彩色和黑白图片。但是鉴于许多小伙伴不擅长使用ps，也不想麻烦设计师，还想要实现黑白变彩色就可以使用这个组件： 左右滑动模糊变清晰 | 黑白变彩色 组件ID：266
·
·
向左滑动变色→
此组件，你仅需上传一张彩色图片，组件内置了黑白滤镜和模糊滤镜，你可以根据自己的需求调整数值大小。
·
向左滑动模糊黑白变清晰彩色→
1.进入svg编辑器，在编辑器左侧找到【svg编辑器】点击进入
2.在【互动效果中】输入组件ID：266；
3.点击组件到编辑区域，上传图片并调整【模糊】【黑白】参数；
4.【导出代码】复制代码到135编辑器或是到微信后台。
如果你想要营造一种【探秘】【悬疑】的氛围，想要让用户自己去滑动寻找你隐藏的彩蛋，那么这个组件效果你一定不能错过。 滑动见底图，组件ID：261
·
注：黑色遮罩的透明度由用户自行设置
1.进入svg编辑器，在编辑器左侧找到【svg编辑器】点击进入
2.在【互动效果中】输入组件ID：261；
3.点击组件到编辑区域，上传【背景图】和【滑动图】可设置滑动宽度；
4.【导出代码】复制代码到135编辑器或是到微信后台。
若是想要实现【换装】【变脸】前后有一定反差效果的，可以使用 背景图固定前景自动居中双层滑动 ID：198
·
·
1.进入svg编辑器，在编辑器左侧找到【svg编辑器】点击进入
2.在【互动效果中】输入组件ID：198；
3.点击组件到编辑区域，上传【背景图】和【滑动图】可自定义设置滑动方向、跳转链接、小程序；
4.【导出代码】复制代码到135编辑器或是到微信后台。
以上就是三儿为大家
带来的基于【滑动】效果的svg组件
当然组件还有很多
大家还有什么想要了解的
可以在评论区留言
我们一起探索更多有趣的玩法
春天到了
又到了踏青好时节
135也大家准备了踏青好礼
快扫码了解详情吧
更多有趣好玩的内容
尽在135编辑器返回搜狐，查看更多