# tank-vue3-seamless-scroll

**Repository Path**: dangcheng/tank-vue3-seamless-scroll

## Basic Information

- **Project Name**: tank-vue3-seamless-scroll
- **Description**: vue3 seamless scroll component
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-07-08
- **Last Updated**: 2025-07-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

[English](README.md) | 中文

# tank-vue3-seamless-scroll

## features

* 这是一个高性能的无缝滚动插件
* 事件监听不会失效

## 警告

如果您打算对大量数据使用此插件，我们未做任何vue第三方组件针对性内存、cpu的虚拟优化，请谨慎选择

## 运行环境

* vue3
* nodejs 14.15.0+

# 预览

点击图片播放动画

[![demo](./demo.jpg)](https://user-images.githubusercontent.com/466966/233253193-66d316da-3803-41dc-b115-3d74ec2b8d8d.mp4)

[在线演示](https://fanqie.github.io/tank-vue3-seamless-scroll/dist/index.html)

## 快速开始

### 安装

```shell
npm install --save tank-vue3-seamless-scroll
```

### 导入

```js
import TankSeamlessScroll from "tank-vue3-seamless-scroll"
```

### 使用组件

```html

<div style="height:300px;">
    <tank-seamless-scroll :step-length="25" :debug="true" :reverse="false">
        <div class="demo">
            <div v-for="i in 2" :key="i">测试{{ i }}</div>
        </div>
    </tank-seamless-scroll>
</div>
```

### api

#### step-length

* 描述：每秒移动像素高度
* 默认值: 60 (px/秒)
* 类型: Number

#### reverse

* 描述：动画将反向滚动播放
* 默认值: false
* 类型: Boolean

#### debug

* 描述：是否显示调试信息
* 默认值: false
* 类型: Boolean

#### pauseOnHover:

* desc：鼠标悬停时是否暂停
* default: true
* type: Boolean