当前位置: 首页 > news >正文

Uniapp:swiper(滑块视图容器)

目录

  • 一、基本概述
  • 二、属性说明
  • 三、基本使用


一、基本概述

一般用于左右滑动或上下滑动,比如banner轮播图

二、属性说明

属性名类型默认值说明平台差异说明
indicator-dotsBooleanfalse是否显示面板指示点
indicator-colorColorrgba(0, 0, 0, .3)指示点颜色
indicator-active-colorColor#000000当前选中的指示点颜色
autoplayBooleanfalse是否自动切换
intervalNumber5000自动切换时间间隔
durationNumber500滑动动画时长
circularBooleanfalse是否采用衔接滑动,即播放到末尾后重新回到开头
verticalBooleanfalse滑动方向是否为纵向

三、基本使用

在这里插入图片描述

<swiper class="swiper" indicator-dots indicator-color="#32cd32" indicator-active-color="#ffaa00" autoplay interval="2000" duration="400" circular vertical><swiper-item><view class="swiper-item uni-bg-red">A</view></swiper-item><swiper-item><view class="swiper-item uni-bg-green">B</view></swiper-item><swiper-item><view class="swiper-item uni-bg-blue">C</view></swiper-item>
</swiper>
.swiper {margin-top: 10px;height: 300rpx;
}
.uni-margin-wrap {width:690rpx;width: 100%;;
}
.swiper-item {display: block;height: 300rpx;line-height: 300rpx;text-align: center;
}
http://www.dtcms.com/a/148034.html

相关文章:

  • ubuntu20.04 远程桌面Xrdp方式
  • AR/VR衍射光波导性能提升遇阻?OAS光学软件有方法
  • AOSP Android14 Launcher3——RecentsView最近任务数据加载
  • Java面试实战:从Spring Boot到微服务的深入探讨
  • 双周报Vol.70: 运算符重载语义变化、String API 改动、IDE Markdown 格式支持优化...多项更新升级!
  • 用Java实现简易区块链:从零开始的探索
  • 智能电网第1期 | 工业交换机在变电站自动化系统中的作用
  • 【云馨AI-大模型】Dify 1.2.0:极速集成 SearXNG,畅享智能联网搜索新境界,一键脚本轻松部署SearXNG
  • 基于STM32、HAL库的MCP41010T数字电位器驱动程序设计
  • idea快捷键 Project tool window
  • 【Linux网络与网络编程】07.应用层协议HTTPS
  • 眼镜眨巴眨巴-一步几个脚印从头设计数字生命2——仙盟创梦IDE
  • 国产紫光同创FPGA实现SDI视频编解码+图像缩放,基于HSSTHP高速接口,提供2套工程源码和技术支持
  • 国产紫光同创FPGA实现SDI视频编解码,基于HSSTHP高速接口,提供3套工程源码和技术支持
  • 【Python】Selenium切换网页的标签页的写法(全!!!)
  • 学习思路分享---从0开始搭建基本web服务器
  • 飞搭系列 | 组件增加标记,提升用户体验
  • 动态加载内容时selenium如何操作?
  • KDD Cup 2017 数据集分析
  • 快速定位达梦缓存的执行计划并清理
  • HTML页面结构最佳实践方案
  • Phyton简介与入门
  • TextCNN 模型文本分类实战:深度学习在自然语言处理中的应用
  • DeepSeek开源引爆AI Agent革命:应用生态迎来“安卓时刻”
  • 【Qt】QDialog类
  • PyTorch 多 GPU 入门:深入解析 nn.DataParallel 的工作原理与局限
  • 帕金森发病类型和阶段
  • 安徽京准:关于石油管道监控NTP时间同步服务器方案
  • 基于外部中中断机制,实现以下功能: 1.按键1,按下和释放后,点亮LED 2.按键2,按下和释放后,熄灭LED 3.按键3,按下和释放后,使得LED闪烁
  • WebRTC服务器Coturn服务器用户管理和安全性