轮播

Carousel 

一.定义

同类型图片/碎片的自动轮播或手动轮播。

二.用途

用于扩充单位面积内的展示信息量。

三.类型

自动轮播、手动轮播

1.自动轮播

1.1 样式描述

元素包括：轮播图、轮播定位点；

1.2 布局说明

1）通栏轮播时，图片之间需间隔一定像素距离；固定区域内轮播时可根据效果不增加间隔；

2）定位点位置可居中、居左或居右；

【交互说明】

1）从首图开始循环轮播，从进入页面开始计时，单次切换间隔4秒、滑动持续时间300毫秒；

2）支持手动触发滑动，图片单次切换间隔时间以滑动频率为准，滑动持续时间300毫秒；

3）手势滑动的消耗时间不计入自动轮播间隔时间中。

【交互说明】

1）从首图开始循环轮播，从进入页面开始计时，单次切换间隔3秒、滑动持续时间300毫秒；

2）支持手动触发滑动，图片单次切换间隔时间以滑动频率为准，滑动持续时间300毫秒；

3）手势滑动的消耗时间不计入自动轮播间隔时间中；

4）循环滚动轮播。

2.手动轮播

1.1 样式描述

元素包括：轮播图/轮播碎片；

1.2 布局说明

1）元素之间需间隔一定像素距离；

2）一屏内需看到大于1个的可滑动元素。

【交互说明】

1）初始状态定位在首图/首个碎片；

2）不支持循环，滑动至最前/最后时需弹性效果响应。

3.场景举例

Powered by Froala Editor