nav-keys
v1.3.0
Published
Control of browser back and forward navigation keys
Downloads
8
Maintainers
Readme
Browser Navigation keys (⬅ ➡) controller
Please, if you can give me a ⭐ on GitHub. Also make me know of any bug, problem or something you need.
Full control of back and forward keys on browser
It can:
- Listen to
back
,forward
andhashchange
events - Prevents any change on url or history state
- It doesn't have history functionallity (only overrides and listen 'back' and 'forward' keys)
- Ideal to make apps thats uses back button
- Can enable and disable forward key
import NavKeysController from 'nav-keys'
const options = {
allowHashchange: true // by default it won't prevent hashchange and will emit an event
listenHashchange: true // by default it will emit hashchange events
}
const controller = new NavKeysController(window.history, options) // both params are optional
controller.url = 'home'
controller.listen(e => {
console.log(e) // Won´t see this
})
controller.listen(e => {
e.stopPropagation()
})
controller.listen(e => {
console.log(e) // Will see this
console.log(e.action)
console.log(e.location)
if (e.action === 'back') {
controller.url = 'previos page'
controller.enableForwardButton()
} else if (e.action === 'forward') {
controller.url = 'next page'
controller.disableForwardButton()
} else if (e.action === 'hashchange') {
controller.url = 'hash page'
}
})
// Listeners behaviour is like a stack
Internet Explorer Compatibility
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
<script src="nav-keys.js"></script>
<script>
var controller = new NavKeysController(window.history)
</script>