Lines Matching refs:swiper

88 3.  实现城市空气质量信息的多屏左右滑动，需要使用“swiper”组件。
90     在根节点中添加一个子节点swiper，代码片段如下：
100         <swiper class="swiper" index="{{swiperPage}}" duration="500" onchange="swiperChange">
101         </swiper>
105     -   class="swiper"设置了组件的高度和宽度，代码如下：
108         .swiper {
114 …ration="500" onchange="swiperChange" 这些代码用来设置组件的属性和事件。其中，duration="500" 表示设置swiper的页面滑动的动画时长为500ms。
115 …-   index="\{\{swiperPage\}\}"设置了swiper子组件索引值，\{\{swiperPage\}\}这种写法表示index的值是和js代码中的swiperPage变量动…
116     -   onchange="swiperChange" 设置了swiper组件的change事件和函数swiperChange绑定，对应的js代码如下：
136             //swiper滑动回调事件，保存当前swiper的index值，每次滑动都会将index值保存在swiperPage变量中
145     在swiper中添加两个子组件stack（绝对布局），每个stack组件内分别添加text、image、progress等组件来显示对应的信息 ，页面结构如下：
148      <swiper class="swiper" index="{{swiperPage}}" duration="500" onchange="swiperChange">
150         <stack class="swiper">
172     </swiper>
180 5.  添加页面位置指示器：由于当前swiper不支持设置indicator，需要开发者自己来实现该效果。在根节点中添加一个子组件div，并设置相应样式；然后在该div中添加两个子组件div，设置两…
204         <swiper class="swiper" index="{{swiperPage}}" duration="500" onchange="swiperChange">
205             <stack class="swiper">
270             <stack class="swiper">
335         </swiper>
456     .swiper {