{"id":21891953,"url":"https://github.com/capsidjs/capsid-scroll-lock","last_synced_at":"2026-05-16T22:32:37.894Z","repository":{"id":57194186,"uuid":"128013227","full_name":"capsidjs/capsid-scroll-lock","owner":"capsidjs","description":":clamp: Body Scroll Lock as capsid module :pill:","archived":false,"fork":false,"pushed_at":"2020-03-07T11:46:43.000Z","size":110,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-06T15:04:58.462Z","etag":null,"topics":["body","body-scroll-lock","capsid","capsid-module","scroll-lock"],"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/capsidjs.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}},"created_at":"2018-04-04T05:47:56.000Z","updated_at":"2020-03-07T11:46:42.000Z","dependencies_parsed_at":"2022-09-01T23:41:01.740Z","dependency_job_id":null,"html_url":"https://github.com/capsidjs/capsid-scroll-lock","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/capsidjs/capsid-scroll-lock","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/capsidjs%2Fcapsid-scroll-lock","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/capsidjs%2Fcapsid-scroll-lock/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/capsidjs%2Fcapsid-scroll-lock/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/capsidjs%2Fcapsid-scroll-lock/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/capsidjs","download_url":"https://codeload.github.com/capsidjs/capsid-scroll-lock/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/capsidjs%2Fcapsid-scroll-lock/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":265453215,"owners_count":23768093,"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":["body","body-scroll-lock","capsid","capsid-module","scroll-lock"],"created_at":"2024-11-28T12:46:18.826Z","updated_at":"2026-05-16T22:32:32.874Z","avatar_url":"https://github.com/capsidjs.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# capsid-scroll-lock v2.0.0\n\n[![CircleCI](https://circleci.com/gh/capsidjs/capsid-scroll-lock.svg?style=svg)](https://circleci.com/gh/capsidjs/capsid-scroll-lock)\n[![codecov](https://codecov.io/gh/capsidjs/capsid-scroll-lock/branch/master/graph/badge.svg)](https://codecov.io/gh/capsidjs/capsid-scroll-lock)\n\n\n\u003e :clamp: Body Scroll Lock as [capsid][] module :pill:\n\n# Usage\n\nInstall via npm:\n\n    npm i --save-dev capsid capsid-scroll-lock\n\nInstall it to [capsid][].\n\n```js\ncapsid.install(require('capsid-scroll-lock'))\n```\n\nThen, add `scroll-lock` class to your body tag.\n\n```html\n\u003cbody class=\"scroll-lock\"\u003e\n  ...\n\u003c/body\u003e\n```\n\nThen dispatch `capsid-scroll-lock/LOCK` custom DOM event to lock the scroll of `body` and `capsid-scroll-lock/UNLOCK` event to unlock it.\n\n```js\ndocument.body.dispatchEvent(new CustomEvent('capsid-scroll-lock/LOCK'))\n```\n\nThis locks the body scroll.\n\n```js\ndocument.body.dispatchEvent(new CustomEvent('capsid-scroll-lock/UNLOCK'))\n```\n\nThe above unlocks the body scroll.\n\nThose event names are available as `LOCK` and `UNLOCK` values from the module.\n\n```js\nconst { LOCK, UNLOCK } = require('capsid-scroll-lock')\n\nconsole.log(LOCK) // =\u003e \"capsid-scroll-lock/LOCK\"\nconsole.log(UNLOCK) // =\u003e \"capsid-scroll-lock/UNLOCK\"\n```\n\n# Example\n\nIf you use vanilla.js\n\n```js\nconst { LOCK, UNLOCK } = require('capsid-scroll-lock')\n\ndocument.body.dispatchEvent(new CustomEvent(LOCK))\ndocument.body.dispatchEvent(new CustomEvent(UNLOCK))\n```\n\nIf you use capsid.js\n\n```js\nconst { LOCK, UNLOCK } = require('capsid-scroll-lock')\nconst { component, emits } = require('capsid')\n\n@component('my-component')\nclass MyComponent {\n  @emits(LOCK)\n  lockMethod () { ... }\n\n  @emits(UNLOCK)\n  unlockMethod () { ... }\n}\n```\n\nAnd put `my-component` somewhere in body\n\n```html\n\u003cbody class=\"scroll-lock\"\u003e\n  ...\n  \u003cdiv class=\"my-component\"\u003e\n  \u003c/div\u003e\n  ...\n\u003c/body\u003e\n```\n\nThen invoking `lockMethod` locks the body and `unlockMethod` unlocks the body.\n\n# API\n\n```js\nconst { install, LOCK, UNLOCK } = require('capsid-scroll-lock')\n```\n\n## install(capsid, { name })\n\n- @param capsid - The capsid object\n- @param {string} name - The name of scroll-lock class. Default `scroll-lock`.\n\nInstalls the module to capsid.\n\n```js\nrequire('capsid-scroll-lock').install(capsid, { name: 'my-scroll-lock' })\n```\n\nAlternatively you can call it like:\n\n```js\ncapsid.install(require('capsid-scroll-lock'), { name: 'my-scroll-lock' })\n```\n\n## LOCK, UNLOCK\n\n```js\nconst LOCK = 'capsid-scroll-lock/LOCK'\nconst UNLOCK = 'capsid-scroll-lock/UNLOCK'\n```\n\nThese are custom event names for locking and unlocking the body scroll.\n\n# License\n\nMIT\n\n[capsid]: https://github.com/capsidjs/capsid\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcapsidjs%2Fcapsid-scroll-lock","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcapsidjs%2Fcapsid-scroll-lock","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcapsidjs%2Fcapsid-scroll-lock/lists"}