PC端和移动端的图片滑动切换插件,你有用过吗?

前言

图片切换在目前的web或者app应用中早已不是新鲜事,尤其是在App首页顶部推荐中会经常用到,今天就给大家推荐几款Github上开源的图片滑动切换库。

slick

slick一款功能异常强大的图片切换效果库,支持各种动画效果和样式,运行效果如下图所示。

slick运行效果

目前slick在Github上的信息如下图所示。

github上的信息

目前star数已经达到了18k+,可以说是非常火热的一个开源库了。

  • 安装

可以通过npm或者bower进行安装。

安装

  • 实现

首先看下html代码,是一个很简单的div代码块。

html代码

然后是js代码进行调用,其中包含一些常用的配置。

js代码调用

slick库唯一的缺点就是依赖于jQuery,现在已经没人喜欢用jQuery了,希望slick库能脱离jQuery,那样就会更受欢迎了。

swipe

swipe是一款轻量级的图片滑动切换的库,对移动端表现出完美的支持,运行效果如下。

swipe插件运行效果

目前swipe在Github上的信息如下所示。

swipe在github上的信息

  • 安装

swipe同样支持npm和bower安装的方式。

安装

  • 使用

使用swipe插件也非常的简单,首先定义html元素。

html元素

然后定义CSS样式。

CSS样式

最后通过js代码进行调用。

js代码调用

总结

今天这篇文章给大家总结了两个非常实用的图片滑动切换插件,分别支持PC端和移动端,欢迎自己动手体验。

原文链接:,转发请注明来源!