You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
23 lines
627 B
23 lines
627 B
const buttons = document.querySelectorAll('.ripple')
|
|
|
|
buttons.forEach(button => {
|
|
button.addEventListener('click', function (e) {
|
|
const x = e.pageX
|
|
const y = e.pageY
|
|
|
|
const buttonTop = e.target.offsetTop
|
|
const buttonLeft = e.target.offsetLeft
|
|
|
|
const xInside = x - buttonLeft
|
|
const yInside = y - buttonTop
|
|
|
|
const circle = document.createElement('span')
|
|
circle.classList.add('circle')
|
|
circle.style.top = yInside + 'px'
|
|
circle.style.left = xInside + 'px'
|
|
|
|
this.appendChild(circle)
|
|
|
|
setTimeout(() => circle.remove(), 500)
|
|
})
|
|
}) |