73 lines
2.1 KiB
Markdown
73 lines
2.1 KiB
Markdown
<p align="center">
|
||
<img alt="logo" src="https://assets-1256020106.cos.ap-beijing.myqcloud.com/zebra-swiper/logo.png" width="220" style="margin-bottom: 10px;">
|
||
</p>
|
||
|
||
<h1 align="center">ZebraSwiper</h1>
|
||
|
||
<p align="center">基于uniapp，全面对标swiper，并实现全端兼容。</p>
|
||
|
||
<p align="center">
|
||
🔥 <a href="https://swiper.zebraui.com/">文档网站</a>
|
||
|
||
|
||
🚀 <a href="https://zebraui.com/" target="_blank">zebraUI组件库</a>
|
||
</p>
|
||
|
||
## 介绍
|
||
|
||
[zebra-swiper](https://github.com/zebra-ui/zebra-uniapp-swiper) 是基于uniapp开发的一款移动端轮播组件，旨在实现一些复杂的轮播交互。
|
||
|
||
## 特性
|
||
|
||
- 全面对标swiper，并实现全端兼容
|
||
- 兼容多端，小程序也可实现3D轮播效果
|
||
- 可自定义3D效果
|
||
- 多种示例可供参考
|
||
|
||
## 安装
|
||
|
||
### npm方式
|
||
|
||
```bash
|
||
npm i @zebra-ui/swiper
|
||
```
|
||
|
||
```js
|
||
// pages.json
|
||
|
||
{
|
||
"easycom": {
|
||
"autoscan": true,
|
||
"custom": {
|
||
"^z-(.*)": "@zebra-ui/swiper/components/z-$1/z-$1.vue"
|
||
}
|
||
},
|
||
"pages": [...],
|
||
"globalStyle": {...}
|
||
}
|
||
```
|
||
|
||
### uni_modules方式
|
||
|
||
[插件市场](https://ext.dcloud.net.cn/plugin?id=7273)直接导入即可
|
||
|
||
## 手机预览
|
||
|
||
<div>
|
||
<img alt="wx" src="https://assets-1256020106.cos.ap-beijing.myqcloud.com/zebra-swiper/wx.jpg" width="200" />
|
||
<img alt="ali" src="https://assets-1256020106.cos.ap-beijing.myqcloud.com/zebra-swiper/ali.jpg" width="200" />
|
||
<img alt="h5" src="https://assets-1256020106.cos.ap-beijing.myqcloud.com/zebra-swiper/h5.png" width="200" />
|
||
</div>
|
||
|
||
## 预览
|
||
<div style="display:flex;flex-wrap:wrap;margin-top:30px;">
|
||
<img alt="gif" src="https://assets-1256020106.file.myqcloud.com/zebra-swiper/show/total1.gif" width="300" style="margin:20px;" />
|
||
<img alt="gif" src="https://assets-1256020106.file.myqcloud.com/zebra-swiper/show/total2.gif" width="300" style="margin:20px;" />
|
||
<img alt="gif" src="https://assets-1256020106.file.myqcloud.com/zebra-swiper/show/total3.gif" width="300" style="margin:20px;" />
|
||
</div>
|
||
|
||
## 群
|
||
|
||
QQ群：947159437
|
||
|
||
 |