media-viewer

image/video viewer

npm install media-viewer --save-dev
# or
npm i media-viewer -D

import { MediaViewer } from 'media-viewer'

let arr = [
  {
    thumb: './1.jpg',
    url: './1.mp4',
    type: 2
  },
  {
    thumb: './2.jpg',
    url: './2.jpg',
    type: 1
  }
]

// 参数配置
let options = {
  // ...
}
// 实例化
let mv = new MediaViewer(options, arr)

setTimeout(_ => {
  // 查看第一个元素
  mv.view(0)
}, 2000)

options 参数

|参数|类型|必须|说明| |:--|:--|:--|:--| |error|Function|否|错误通知| |showPagination|Boolean|否|显示pagination, 默认true| |paginationEvent|String|否|触发切换图片事件名称, 默认'mouseover'| |showThumb|Boolean|否|显示缩略图, 默认true| |thumbPosition|String|否|缩略图显示位置top/bottom, 默认bottom| |closeOnClickMask|Boolean|否|点击空白处关闭窗口, 默认true|

methods 方法

• view(index, newMediaArray)

  index: Number, 必须。查看第index + 1张图片或视频。

  newMediaArray: Array, 可选。新的媒体url数组。