"use strict";
const NAV =
`
- Simple
- Math
- Hard
- Events
- External
`
function setNavbar() {
let nav = document.createElement('nav')
nav.innerHTML = NAV
document.body.append(nav)
nav.querySelectorAll("li").forEach(li => {
let div = li.firstElementChild
li.onmouseenter = () => {
div.style.display = 'block'
let w = div.offsetWidth - li.offsetWidth
let x = li.offsetLeft - w/2
let m = nav.offsetWidth - div.offsetWidth
div.style.left = Math.min(Math.max(0, x), m)+'px'
}
li.onmouseleave = () => { div.style.display = '' }
})
}
setNavbar()