js图片百叶窗效果

当前位置:主页 > jQuery库 > 图片效果 > js图片百叶窗效果
js图片百叶窗效果
分享:

    插件介绍

    这是一款纯js和CSS3制作的图片百叶窗效果。该js图片百叶窗效果集成了多种百叶窗过渡动画效果,可以在多种环境中使用,如轮播图和下拉滚动等。

    浏览器兼容性

    浏览器兼容性
    时间:2018-02-08
    阅读:
小编推荐: 掘金是国内最活跃的技术社区,从 jQuery到vue,从前端教程到开源库,无论是入门还是进阶,来掘金你不会错过前端开发的任何一个技术干货。
简要教程

这是一款纯js和CSS3制作的图片百叶窗效果。该js图片百叶窗效果集成了多种百叶窗过渡动画效果,可以在多种环境中使用,如轮播图和下拉滚动等。

该js图片百叶窗效果使用了最小的css属性,需要在最新版本的浏览器中才可以看到效果。

该js图片百叶窗效果的动画使用anime.js来制作,第三个demo的滚动监听效果使用的是Intersection Observer API

下面是该js图片百叶窗效果的gif动图效果。

js图片百叶窗效果

该js图片百叶窗效果的github地址为:https://github.com/codrops/SliceRevealer

网友评论