saber-scroll

KO | EN

gitlite — search

#hacktoberfest #typescript #llm #golang #go #rust #linux #macos #awesome #vue #awesome-list #pytorch #security #mcp

(★ 9)

为移动端页面提供区域滚动功能

saber-scroll 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

saber-scroll
===

为移动端页面提供区域滚动功能

提供元素内容垂直、水平滚动。颗粒化功能，以插件形式提供增强功能，方便组合，文件大小可控

## Installation

通过 [edp](https://github.com/ecomfe/edp) 引入模块：

```sh
edp import saber-scroll
```

## Usage

```js
var scroll = require('saber-scroll');
var scroller = scroll(document.getElementById('wrapper'));
scroller.on('change', function (e) {
    console.log(e.left, e.top);
});
```

__只滚动区域的第一个子元素__，如果想让区域中的所有元素都能滚动请添加包裹元素，比如这样：

```html
<div class="content">
    <div class="wrapper">
        ...
    </div>
</div>
```

## API

* [Methods](#methods)
* [Classes](#classes)
* [Plugins](#plugins)

### Methods

#### scroll(ele[, options])

使元素内容可滚动

* **ele** `{HTMLElemnt}` 内容需要滚动的元素或者对应的id
* **options** `{Object=}` 初始化参数
    * **horizontal** `{boolean=}` 是否可以水平滚动，默认为`true`
    * **vertical** `{boolean=}` 是否可以垂直滚动，默认为`true`
    * **overflow** `{boolean=}` 是否可以超出滚动范围，默认为`true`
* _return_ `{Scroller}` [Scroller](doc/scroller.md)滚动对象

滚动条是以插件形式实现的，在使用时除了设置`options.scrollbar`外，还需要引入`saber-scroll/plugin/scrollbar`模块

### Classes

* [Scroller](doc/scroller.md) [scroll()](#scrollele-options)创建的滚动对象

### Plugins

* [scrollbar](doc/plugin/scrollbar.md) 为滚动区域添加滚动条
* [overflowHint](doc/plugin/overflowHint.md) 提供到达或者超出滚动范围的提示样式

插件用于丰富功能，需要额外引入并设置相应的属性，例如：

```js
var scroll = require('saber-scroll');
// 引入scrollbar插件
require('saber-scroll/plugin/scrollbar');

var scroller = scroll(
    ele,
    {
        // 启用scrollbar插件
        scrollbar: true
    }
);
```

saber-scroll

saber-scroll 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

saber-scroll

saber-scroll 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README