vue-concise-slider 一个轻量的vue幻灯片组件

  • Z时代
  • 2024-01-10
  • 分类：综合

vue

阅读 541

收藏 35

2017-07-03

原文链接：github.com

外卖订单处理有烦恼？试试美团点评餐饮开放平台吧，可实现自动接单／录单！http://developer.meituan.com/info

中文 | English

vue-concise-slider.js

  

vue-concise-slider,一个简单的滑动组件,配置简单,支持自适应/全屏+按钮+分页,同时兼容移动端和PC端

版本

v2.1.2 支持vue2.0+

目前已实现

  •  全屏自适应

  •  移动端兼容

  •  垂直滚动

  •  定时自动切换

  •  不定宽度滚动

  •  无缝循环滚动

  •  多级滚动

未来将实现

  •  渐变滚动

  •  视差效果

例子

slider效果
完整文档

安装

  npm install vue-concise-slider --save

如何使用

<template>
  <slider :pages="pages" :sliderinit="sliderinit">
    <!-- slot  -->
  </slider>
</template>
<script>
import slider from 'vue-concise-slider'// 引入slider组件
export default {
   el: '#app',
   data () {
      return {
        //图片列表[arr]
        pages:[
          {
            title: '',
            style:{
             background:'url(src/img/testimg-1.jpg)'
            }
          },
          {
           title: '',
           style:{
            background:'url(src/img/testimg-2.jpg)'
            }
          },
          {
            title: 'slide3',
            style

以上是 vue-concise-slider 一个轻量的vue幻灯片组件 的全部内容， 来源链接： utcz.com/z/377368.html

回到顶部