{"id":17704986,"url":"https://github.com/dwqs/beautify-scrollbar","last_synced_at":"2025-04-01T12:31:16.281Z","repository":{"id":87782391,"uuid":"123537459","full_name":"dwqs/beautify-scrollbar","owner":"dwqs","description":"Beautify browser's scrollbars: https://dwqs.github.io/beautify-scrollbar/index","archived":true,"fork":false,"pushed_at":"2018-04-20T08:57:34.000Z","size":367,"stargazers_count":12,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-08T07:07:23.923Z","etag":null,"topics":["beautify","beautify-scrollbar","javascript","js","scrollbar"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dwqs.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-03-02T06:01:52.000Z","updated_at":"2025-01-14T09:47:46.000Z","dependencies_parsed_at":null,"dependency_job_id":"a3d57b21-845e-4f0f-87b8-152da73d312e","html_url":"https://github.com/dwqs/beautify-scrollbar","commit_stats":{"total_commits":80,"total_committers":2,"mean_commits":40.0,"dds":"0.012499999999999956","last_synced_commit":"5f737829723b7bb221063d0675560dfdcb78e6fa"},"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dwqs%2Fbeautify-scrollbar","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dwqs%2Fbeautify-scrollbar/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dwqs%2Fbeautify-scrollbar/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dwqs%2Fbeautify-scrollbar/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dwqs","download_url":"https://codeload.github.com/dwqs/beautify-scrollbar/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246639710,"owners_count":20810060,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["beautify","beautify-scrollbar","javascript","js","scrollbar"],"created_at":"2024-10-24T22:05:47.346Z","updated_at":"2025-04-01T12:31:15.757Z","avatar_url":"https://github.com/dwqs.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![build pass](https://api.travis-ci.org/dwqs/beautify-scrollbar.svg?branch=master)](https://travis-ci.org/dwqs/beautify-scrollbar) [![js-standard-style](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)](http://standardjs.com) ![npm-version](https://img.shields.io/npm/v/beautify-scrollbar.svg) ![license](https://img.shields.io/npm/l/beautify-scrollbar.svg)\n# beautify-scrollbar\nBeautify browser's scrollbars.\n\n## Installation\n\nnpm:\n\n```\nnpm i --save beautify-scrollbar\n```\nor yarn\n\n```\nyarn add  beautify-scrollbar\n```\n\n## Get Started\n\n```\nimport 'beautify-scrollbar/dist/index.css';\nimport BeautifyScrollbar from 'beautify-scrollbar';\n\nconst container = document.querySelector('#container')\nconst bs = new BeautifyScrollbar(container);\n\n// or\nconst bs = new BeautifyScrollbar('#container');\n\n// or with options\nconst bs = new BeautifyScrollbar('#container', {\n    wheelSpeed: 2\n});\n```\n\nVisit the [examples](https://dwqs.github.io/beautify-scrollbar).\n\n\u003eNote: the height of this container element which is returned by `getBoundingClientRect()` can not be 0, it must hava a `height` style.\n\n## Options\n### wheelSpeed\n**Type:** `Number`\n\n**Default:** `1`\n\nThe scroll speed applied to mousewheel event.\n\n### threshold\n**Type:** `Number`\n\n**Default:** `1`\n\nThe threshold value to trigger next-fetch in infinite scrolling.\n\n### shownScrollbarX\n**Type:** `Boolean`\n\n**Default:** `true`\n\nWhen set to false, the scroll bar in X axis will not be available, regardless of the content width.\n\n### shownScrollbarY\n**Type:** `Boolean`\n\n**Default:** `true`\n\nWhen set to false, the scroll bar in Y axis will not be available, regardless of the content height.\n\n### maxThumbXLength\n**Type:** `Number`\n\n**Default:** `undefined`\n\nWhen set to an integer value, the X thumb part of the scrollbar will not expand over that number of pixels.\n\n### maxThumbYLength \n**Type:** `Number`\n\n**Default:** `undefined`\n\nWhen set to an integer value, the Y thumb part of the scrollbar will not expand over that number of pixels.\n\n## Events\n`beautify-scrollbar` dispatches custom events.\n\n```js\ncontainer.addEventListener('bs-x-reach-end', () =\u003e ..., false);\n```\n\n### `bs-y-reach-start`\nThis event fires when scrolling reaches the start of the y-axis.\n\n### `bs-y-reach-end`\nThis event fires when scrolling reaches the end of the y-axis.\n\n### `bs-x-reach-start`\nThis event fires when scrolling reaches the start of the x-axis.\n\n### `bs-x-reach-end`\nThis event fires when scrolling reaches the end of the x-axis.\n\n### `bs-update-scroll-value`\nThis event fires when scrollLeft or scrollTop is updated.\n\n### `bs-reach-threshold`\nThis event fires when `diff-value` is lte the `options.threshold`.\n\n\u003ediff-value = container.scrollHeight - container.scrollTop - container.height\n\n## API\n### update([options])\nUpdate some props of instance when you need. Maybe it's useful when it combines with [v2-lazy-list](https://github.com/dwqs/v2-lazy-list);\n\n### destroy\nDestroy the instance and will unbind events whose instance bind.\n\n## Development\n```\ngit clone git@github.com:dwqs/beautify-scrollbar.git\n\ncd beautify-scrollbar\n\nnpm i \n\nnpm run dev\n```\n\n## LICENSE\nMIT","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdwqs%2Fbeautify-scrollbar","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdwqs%2Fbeautify-scrollbar","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdwqs%2Fbeautify-scrollbar/lists"}