capsid-scroll-lock
Advanced tools
:clamp: Body Scroll Lock as capsid module :pill:
Install via npm:
npm i --save-dev capsid capsid-scroll-lock
Install it to capsid.
capsid.install(require('capsid-scroll-lock'))
Then, add scroll-lock class to your body tag.
<body class="scroll-lock">
...
</body>
Then dispatch capsid-scroll-lock/LOCK custom DOM event to lock the scroll of body and capsid-scroll-lock/UNLOCK event to unlock it.
document.body.dispatchEvent(new CustomEvent('capsid-scroll-lock/LOCK'))
This locks the body scroll.
document.body.dispatchEvent(new CustomEvent('capsid-scroll-lock/UNLOCK'))
The above unlocks the body scroll.
Those event names are available as LOCK and UNLOCK values from the module.
const { LOCK, UNLOCK } = require('capsid-scroll-lock')
console.log(LOCK) // => "capsid-scroll-lock/LOCK"
console.log(UNLOCK) // => "capsid-scroll-lock/UNLOCK"
If you use vanilla.js
const { LOCK, UNLOCK } = require('capsid-scroll-lock')
document.body.dispatchEvent(new CustomEvent(LOCK))
document.body.dispatchEvent(new CustomEvent(UNLOCK))
If you use capsid.js
const { LOCK, UNLOCK } = require('capsid-scroll-lock')
const { component, emits } = require('capsid')
@component('my-component')
class MyComponent {
@emits(LOCK)
lockMethod () { ... }
@emits(UNLOCK)
unlockMethod () { ... }
}
And put my-component somewhere in body
<body class="scroll-lock">
...
<div class="my-component">
</div>
...
</body>
Then invoking lockMethod locks the body and unlockMethod unlocks the body.
const { install, LOCK, UNLOCK } = require('capsid-scroll-lock')
scroll-lock.Installs the module to capsid.
require('capsid-scroll-lock').install(capsid, { name: 'my-scroll-lock' })
Alternatively you can call it like:
capsid.install(require('capsid-scroll-lock'), { name: 'my-scroll-lock' })
const LOCK = 'capsid-scroll-lock/LOCK'
const UNLOCK = 'capsid-scroll-lock/UNLOCK'
These are custom event names for locking and unlocking the body scroll.
MIT
FAQs
Body Scroll Lock as capsid module
The npm package capsid-scroll-lock receives a total of 2 weekly downloads. As such, capsid-scroll-lock popularity was classified as not popular.
We found that capsid-scroll-lock demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
/Security News
Socket researchers discovered nine malicious NuGet packages that use time-delayed payloads to crash applications and corrupt industrial control systems.
Security News
Socket CTO Ahmad Nassri discusses why supply chain attacks now target developer machines and what AI means for the future of enterprise security.
Security News
Learn the essential steps every developer should take to stay secure on npm and reduce exposure to supply chain attacks.