demo.html

﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>paginate demo</title>

    <style>
        * {
            margin: 0;
            padding: 0;
        }

        body {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-height: 100vh;
            min-width: 100vw;
        }
    </style>
</head>
<body>
    <div id="main"></div>
    <div id="paginate"></div>

    <script src="./dist/Paginate.min.js"></script>
    <script>
        var options = {
            itemsCount: 5,
            displayCount: 5,   
            cursorPosition: 3, 
            leftCount: 1,      
            rightCount: 1,   
            data: ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59", "60", "61", "62", "63", "64", "65", "66", "67", "68", "69", "70", "71", "72", "73", "74", "75", "76", "77", "78", "79", "80", "81", "82", "83", "84", "85", "86", "87", "88", "89", "90", "91", "92", "93", "94", "95", "96", "97", "98", "99"],
            contanier: document.getElementById('paginate')
        };

        var p = new Paginate(options, function (data) {
            var el = document.createElement('p');
            el.textContent = data.reduce(function (old, newi) { return old + ',' + newi; });

            document.getElementById('main').appendChild(el);
        });

    </script>
</body>
</html>