123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263 |
- <!DOCTYPE html>
- <html>
- <head>
- <link href="../css/perfect-scrollbar.css" rel="stylesheet">
- <script src="../dist/perfect-scrollbar.js"></script>
- <style>
- #container {
- border: 1px solid gray;
- height: 150px;
- width: 400px;
- padding: 15px;
- overflow: auto;
- position: relative;
- }
- </style>
- </head>
- <body>
- <div id="container">
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- <p>The command takes options applicable</p>
- </div>
- <button id='redraw'>Redraw</button>
- <script>
- var $ = document.querySelector.bind(document);
- var ps = new PerfectScrollbar('#container');
- $('#redraw').addEventListener('click', function () {
- var oldHtml = $('#container').innerHTML;
- $('#container').innerHTML = '';
- setTimeout(function () {
- $('#container').innerHTML = oldHtml;
- ps.update();
- }, 500);
- });
- </script>
- </body>
- </html>
|