• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > 微信小程序中的swiper组件详解

微信小程序中的swiper组件详解

作者:HaiJing1995 字体:[增加 减小] 来源:互联网 时间:2017-05-11

HaiJing1995通过本文主要向大家介绍了swiper组件,小程序swiper,小程序 swiper 高度,swiper,swiper中文网等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

微信小程序中的swiper组件

微信小程序中的swiper组件真的是简单方便

提供了页面中图片文字等滑动的效果

<swiper>
  <swiper-item></swiper-item>
  <swiper-item></swiper-item>
  <swiper-item></swiper-item>
</swiper>
</div>

这里的就是一个滑块视图容器;而就是你希望滑动的东西,可以是文字也可以是image

其中swiper有很多属性。常用的有

  • 属性名                      默认值                        作用
  • indicator-dots         false                         是否显示面板指示点
  • indicator-color        rgba(0, 0, 0, .3)         指示点的颜色
  • indicator-active-color        #000000        当前选中的指示点颜色
  • autoplay                  false                         是否自动播放
  • intervaly                  5000                         自动切换时间间隔 

更多的属性可以去查看微信小程序官方教程

https://mp.weixin.qq.com/debug/wxadoc/dev/component/swiper.html

这里vertical=”true”在官方文档中没有提到,定义这个可以上下滑动

还有一点需要注意vertical=”false”时,仍然是上下滑动,原因就是微信小程序在解析时将”false”看成字符串,只要字符串不为空,就为真。所以我们需要这样写:vertical=”{{false}}”

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 微信小程序中的swiper组件详解

相关文章

  • 2017-05-11jQuery移除或禁用html元素点击事件常用方法小结
  • 2017-05-11jquery使用EasyUI Tree异步加载JSON数据(生成树)
  • 2017-05-11Vue.use源码分析
  • 2017-05-11Vue.js父与子组件之间传参示例
  • 2017-05-11JS基于onclick事件实现单个按钮的编辑与保存功能示例
  • 2017-08-21js计时器的两种方法
  • 2017-05-11javascript容错处理代码(屏蔽js错误)
  • 2017-05-11js 性能优化之算法和流程控制
  • 2017-05-11jquery点赞功能实现代码 点个赞吧!
  • 2017-05-11微信小程序 Tab页切换更新数据

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • 基于JavaScript实现类名的添加与移除
    • HTML中使背景图片自适应浏览器大小实例详解
    • 基于JS实现二维码图片固定在右下角某处并跟随滚动条滚动
    • JavaScript纯色二维码变成彩色二维码
    • jQuery日程管理插件fullcalendar使用详解
    • angular分页指令操作
    • Bootstrap 3 进度条的实现
    • 利用Jquery实现几款漂亮实用的时间轴(附示例代码)
    • jquery实时获取时间的简单实例
    • 原生JavaScript实现AJAX、JSONP

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有