Skip to content

Instantly share code, notes, and snippets.

@hkitago
Created January 30, 2023 08:26
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 hkitago/61b50a2a878187a1e5f551f5b37074b1 to your computer and use it in GitHub Desktop.
Save hkitago/61b50a2a878187a1e5f551f5b37074b1 to your computer and use it in GitHub Desktop.
Display Some Property On Right Top Corner
const displaySomePropertyOnRightTopCorner = (SomeProperty) => {
if (!SomeProperty) { return false }
const divE = document.createElement('div')
divE.textContent = SomeProperty
divE.style.width = '5vw'
divE.style.height = '5vh'
divE.style.backgroundColor = 'rgb(255 255 255/.5)'
divE.style.zIndex = [...document.querySelectorAll`*`].reduce((a,e,i,t,z=+window.getComputedStyle(e).zIndex||0) => z>a ? z:a ,0) + 1
divE.style.position = 'fixed'
divE.style.right = '0'
divE.style.display = 'flex'
divE.style.justifyContent = 'center'
divE.style.alignItems = 'center'
divE.style.animation = 'fadeOut 2s forwards'
divE.addEventListener('animationend', (e) => {
e.target.parentNode.removeChild(e.target)
})
document.querySelector('body').appendChild(divE)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment