Подскажите как сделать такой cursor эффект при клике со звуком

Недавно на просторах интернета нашел один замечательный сайт в дизайн и работу фронт-эндера которого я влюбился.
Мне очень понравился там эффект курсора после полной загрузки страницы.
При клике на любом месте страницы создается звук и wave эффект
Как можно реализовать такое, подскажите пожалуйста? И возможно ли как-то взять данный звук клика с этого сайта. Я облазил их консоль и вкладку sources но не нашел ничего.
function playSound () { document.getElementById('play').play(); }

Ответ

Вот wave эффект можно сдлеать так.
А звук находится в файле sounds.mp3.
$(document.body).on('click', function(e) { var wave = document.createElement('div'); wave.style.top = (e.pageY - 25) + "px"; wave.style.left = (e.pageX - 25) + "px"; wave.className = 'wave'; setTimeout(function() { wave.classList.add("active"); }, 0); wave.addEventListener("transitionend", function() { wave.remove(); }); document.body.appendChild(wave); }); $(document.body).on('mouseout', function(e) { cursor.style.display = 'none'; }); $(document.body).on('mousemove', function(e) { cursor.style.display = 'block'; cursor.style.top = (e.pageY - 10) + "px"; cursor.style.left = (e.pageX - 10) + "px"; }); body { background-color: pink; width: 100vw; height: 100vh; } * { cursor: none; } .wave { background-color: white; opacity: 0.8; border-radius: 50%; width: 50px; height: 50px; transition: all 1s ease; position: absolute; pointer-events: none; } .wave.active { transform: scale(3); opacity: 0; } #cursor { background-color: gray; opacity: 0.8; border-radius: 50%; width: 20px; height: 20px; position: absolute; pointer-events: none; display: none; }

А вообще сайт красивый, но тормозит ужасно.