本文概述
【照片浏览器参数】Framework7提供了很多参数, 可以与照片浏览器一起使用。
指数 |
参数 |
类型 |
描述 |
1) |
photos |
array |
它是具有图像URL的数组或具有URL和标题属性的对象的数组。 |
2) |
initialSlide |
number |
它是初始幻灯片的索引号。 |
3) |
spaceBetween |
number |
它表示照片幻灯片之间的距离(以像素为单位)。 |
4) |
speed |
number |
它代表幻灯片之间的过渡时间。 |
5) |
zoom |
boolean |
它用于启用/禁用缩放和平移照片的功能。 |
6) |
maxZoom |
number |
这是最大缩放比例。 |
7) |
minZoom |
number |
这是最小缩放比例。 |
8) |
exposition |
boolean |
单击照片浏览器时, 它启用/禁用显示模式。 |
9) |
expositionHideCaptions |
boolean |
如果将其设置为true, 则隐藏博览会模式下的字幕。 |
10) |
swipeToClose |
boolean |
如果启用此功能, 则可以向上/向下滑动来关闭照片浏览器。 |
11) |
view |
View instance |
它是初始化视图实例的链接。 |
12) |
type |
string |
它定义了应如何打开照片浏览器。 |
13) |
loop |
boolean |
设置为true时, 它将启用连续循环模式。 |
14) |
theme |
string |
照片浏览器的颜色主题可以是浅色或深色。 |
15) |
captionsTheme |
string |
它可以是深色或浅色两种。 |
16) |
navbar |
boolean |
设置为false以删除照片浏览器的导航栏。 |
17) |
toolbar |
boolean |
设置为false将删除照片浏览器的工具栏。 |
18) |
backLinkText |
string |
它是导航栏中后面链接上的文本。 |
19) |
ofText |
string |
它是照片计数器中的文本。例如5之3。 |
延迟加载
指数 |
参数 |
类型 |
描述 |
1) |
lazyLoading |
boolean |
设置为true以启用图像的延迟加载。 |
2) |
lazyLoadingInPrevNext |
boolean |
设置为true可以为最近的照片启用延迟加载。 |
3) |
lazyLoadingOnTransitionStart |
boolean |
过渡到照片后, 默认情况下, 照片浏览器将加载惰性照片。如果启用此参数, 则可以在过渡开始时加载新照片。 |
范本
指数 |
参数 |
类型 |
描述 |
1) |
navbartemplate |
string |
这是导航栏html模板。 |
2) |
toolbartemplate |
string |
它是工具栏的html模板。 |
3) |
phototemplate |
string |
这是单个照片元素html模板。 |
4) |
lazyphototemplate |
string |
它是单个延迟加载照片元素html模板。 |
5) |
objecttemplate |
string |
它是单个对象元素html模板。 |
6) |
captiontemplate |
string |
它是单个标题元素html模板。 |
回呼
指数 |
参数 |
类型 |
描述 |
1) |
onOpen(photobrowser) |
function |
它是回调函数, 将在打开照片浏览器时执行。 |
2) |
onClose(photobrowser) |
function |
这是回调函数, 将在用户关闭照片浏览器时执行。 |
3) |
onSwipeToClose(photobrowser) |
function |
这是回调函数, 当用户通过向上或向下滑动关闭照片浏览器时将执行该回调函数。 |
滑动回叫
指数 |
参数 |
类型 |
描述 |
1) |
onSlideChangeStart(swiper) |
function |
该回调函数将在动画开始时执行到其他幻灯片。它以swiper实例为参数。 |
2) |
onSlideChangeEnd(swiper) |
function |
动画播放到其他幻灯片后, 将执行此回调函数。它以swiper实例为参数。 |
3) |
onTransitionStart(swiper) |
function |
该回调函数将在转换开始时执行。它以swiper实例为参数。 |
4) |
onTransitionEnd(swiper) |
function |
该回调函数将在转换后执行。它以swiper实例为参数。 |
5) |
onClick(swiper, event) |
function |
当用户在300ms延迟后单击滑块时, 将运行此回调函数。它接受swiper实例和事件作为参数。 |
6) |
onDoubleTap(swiper, event) |
function |
当用户双击滑块容器时, 将运行此回调函数。 |
7) |
onLazyImageLoad(swiper, slide, image) |
function |
延迟加载开始加载照片时将执行此回调函数。 |
8) |
onLazyImageReady(swiper, slide, image) |
function |
加载延迟加载的照片后, 将执行此功能。 |
推荐阅读