Get started with better-scroll CDN

MIT licensed

Better-scroll is a popular open-source library for implementing high-performance scrolling functionality in web applications.

Tags:
  • scroll
  • iscroll
  • javascript
  • ios

Stable version

Copied!

How to start using better-scroll CDN


<!DOCTYPE html>
<html>
<head>
    <title>Get started with better-scroll CDN - cdnhub.io</title>
    <style>
        #wrapper {
            height: 800px;
            overflow: auto;
        }
        ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
        }
        li {
            height: 100px;
            line-height: 100px;
            text-align: center;
        }
    </style>
</head>
<body>
    <div id="wrapper">
        <ul id="content">
            <li>Item 1</li>
            <li>Item 2</li>
            <li>Item 3</li>
            <li>Item 4</li>
            <li>Item 5</li>
            <li>Item 6</li>
            <li>Item 7</li>
            <li>Item 8</li>
            <li>Item 9</li>
            <li>Item 10</li>
        </ul>
    </div>
    <script src="https://cdn.cdnhub.io/better-scroll/2.5.1/better-scroll.min.js"></script>
    <script>
        let scrollElement = document.getElementById('wrapper');
        let content = document.getElementById('content');
        let myScroll;

        function initScroll() {
            myScroll = new BScroll(scrollElement, {
                click: true,
                probeType: 3
            });

            myScroll.on('scroll', (pos) => {
                console.log('Current scroll position:', pos.y);
            });
        }

        initScroll();
    </script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!

All versions