При нажатии на выделенный текст появляется блок с пояснением.
Как сделать так, что бы вместо нажатия достаточно было просто наведения курсора.
// Fetch notes
useEffect(() => {
if (!container) return;
notes = {};
const links = container.querySelectorAll("a");
for (const link of links) {
ProviderTest.getNote(link).then(note => {
notes[link.pathname] = note;
link.classList.add("fetched");
});
link.onclick = (event) => {
event.preventDefault();
if (!notes[link.pathname]) return;
showNote(link, notes[link.pathname]);
}
}
}, [lyrics])
Я попробовал вместо link.onclick = (event) => {
сделать link.onmouseover = (event) => {
и в целом всё работает нормально, но только для того, что бы скрыть пояснение нужно ещё раз навести на выделенный текст, или на блок самого пояснения, а не просто убрать курсор. Ещё порой случается, если это конец страницы, то пояснение беспрерывно появляется-убирается. Ну и ещё в целом выскакивает пояснение слишком резко. В общем, работает, но колхозно. Может есть варианты получше? Именно с этим кодом, глобально ничего не меняя.
(css) :hover
?