34 lines
785 B
JavaScript
34 lines
785 B
JavaScript
|
// interaction
|
||
|
|
||
|
const primaryNav = document.querySelector('nav')
|
||
|
const menuItem = document.querySelector('#menuItem')
|
||
|
|
||
|
// TODO: (create voice class per button)
|
||
|
// let menuVoices = []
|
||
|
|
||
|
for (let c of primaryNav.children) {
|
||
|
// TODO: (create voice class per button)
|
||
|
// menuVoices[c.dataset.link] = new voice()
|
||
|
|
||
|
c.addEventListener('click', () => {
|
||
|
console.log(`clicked : ${c.dataset.link}`)
|
||
|
})
|
||
|
|
||
|
c.addEventListener('mouseenter', () => {
|
||
|
menuItem.innerHTML = c.dataset.link
|
||
|
menuItem.className = 'active'
|
||
|
voice.play()
|
||
|
})
|
||
|
|
||
|
c.addEventListener('mouseout', () => {
|
||
|
menuItem.className = 'inactive'
|
||
|
voice.release()
|
||
|
})
|
||
|
|
||
|
menuItem.addEventListener('transitionend', () => {
|
||
|
if (menuItem.className == 'inactive') {
|
||
|
menuItem.innerHTML = ''
|
||
|
}
|
||
|
})
|
||
|
}
|