Skip to content

Instantly share code, notes, and snippets.

@linkstrifer
Last active May 20, 2021 17:48
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save linkstrifer/d12481f6f2f1f0b8cf82e713cfd384ee to your computer and use it in GitHub Desktop.
Save linkstrifer/d12481f6f2f1f0b8cf82e713cfd384ee to your computer and use it in GitHub Desktop.
Blur elements on the page on click, add this script minified (https://javascript-minifier.com/) as a bookmark starting with `javascript:` string
(function (document) {
function _toggleBlur(event) {
event.stopPropagation();
if (window.blur_initiated) {
event.target.classList.toggle('__blur')
}
}
function addStyles() {
if (!document.querySelector('#__blur')) {
const $style = document.createElement('style');
$style.innerHTML = `
.__blur {
filter: blur(7px);
}
`
$style.id = '__blur'
document.head.appendChild($style)
}
}
function mount() {
addStyles()
const elements = document.querySelectorAll('body *')
elements.forEach(element => {
element.addEventListener('click', _toggleBlur)
})
}
if (!window.blur_initiated) {
mount();
window.blur_initiated = true
} else {
window.blur_initiated = false
}
})(document)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment