https://github.com/ustbhuangyi/better-scroll

:scroll: inspired by iscroll, and it supports more features and has a better scroll perfermance
https://github.com/ustbhuangyi/better-scroll

better-performance ios iscroll mobile-web more-features vue

Last synced: 6 days ago
JSON representation

:scroll: inspired by iscroll, and it supports more features and has a better scroll perfermance

• Host: GitHub
• URL: https://github.com/ustbhuangyi/better-scroll
• Owner: ustbhuangyi
• License: mit
• Created: 2015-12-18T03:22:16.000Z (about 9 years ago)
• Default Branch: dev
• Last Pushed: 2024-06-14T02:59:46.000Z (7 months ago)
• Last Synced: 2024-10-29T22:51:30.824Z (3 months ago)
• Topics: better-performance, ios, iscroll, mobile-web, more-features, vue
• Language: TypeScript
• Homepage: https://better-scroll.github.io/docs/en-US/
• Size: 17.8 MB
• Stars: 16,468
• Watchers: 260
• Forks: 2,606
• Open Issues: 62
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-frontend-lib - better-scroll
• awesome-github-star - better-scroll
• awesome - ustbhuangyi/better-scroll - :scroll: inspired by iscroll, and it supports more features and has a better scroll perfermance (TypeScript)
• awesome - ustbhuangyi/better-scroll - :scroll: inspired by iscroll, and it supports more features and has a better scroll perfermance (TypeScript)

README

        
# better-scroll



[![npm version](https://img.shields.io/npm/v/better-scroll.svg)](https://www.npmjs.com/package/better-scroll) [![downloads](https://img.shields.io/npm/dm/better-scroll.svg)](https://www.npmjs.com/package/better-scroll) [![Build Status](https://travis-ci.org/ustbhuangyi/better-scroll.svg?branch=master)](https://travis-ci.org/ustbhuangyi/better-scroll)  [![Package Quality](http://npm.packagequality.com/shield/better-scroll.svg)](http://packagequality.com/#?package=better-scroll) [![codecov.io](http://codecov.io/github/ustbhuangyi/better-scroll/coverage.svg?branch=master)](http://codecov.io/github/ustbhuangyi/better-scroll) [![Gitpod Ready-to-Code](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io/from-referrer/)

[中文文档](https://github.com/ustbhuangyi/better-scroll/blob/master/README_zh-CN.md)

[1.x Docs](https://better-scroll.github.io/docs-v1/)

[2.x Docs](https://better-scroll.github.io/docs/en-US/)

[2.x Demo](https://better-scroll.github.io/examples/)

> **Note**: `1.x` is not maintained. please migrate your version as soon as possible

# Install

```bash

npm install better-scroll -S # install 2.x，with full-featured plugin.

npm install @better-scroll/core # only CoreScroll

```

```js

import BetterScroll from 'better-scroll'

let bs = new BetterScroll('.wrapper', {

  movable: true,

  zoom: true

})

import BScroll from '@better-scroll/core'

let bs = new BScroll('.wrapper', {})

```

# CDN

BetterScroll with full-featured plugin.

```html

```

```js

let wrapper = document.getElementById("wrapper")

let bs = BetterScroll.createBScroll(wrapper, {})

```

Only CoreScroll

```html

```

```js

let wrapper = document.getElementById("wrapper")

let bs = new BScroll(wrapper, {})

```

## What is BetterScroll ?

BetterScroll is a plugin which is aimed at solving scrolling circumstances on the mobile side (PC supported already). The core is inspired by the implementation of [iscroll](https://github.com/cubiq/iscroll), so the APIs of BetterScroll are compatible with iscroll on the whole. What's more, BetterScroll also extends some features and optimizes for performance based on iscroll.

BetterScroll is implemented with plain JavaScript, which means it's dependency free.

## Getting started

The most common application scenario of BetterScroll is list scrolling. Let's see its HTML:

```html



  


    
...

    
...

    ...