Monitoring element in html

 

// Attach a scroll event listener

window.addEventListener('scroll', function() {

    const element = document.getElementById('tta');

    const rect = element.getBoundingClientRect();

    // Check if the element is in the viewport

    if (rect.top < window.innerHeight && rect.bottom >= 0) {

        console.log('Element is visible');

    } else {

        console.log('Element is not visible');

    }

})

const element = document.getElementById('tta');

const rect = element.getBoundingClientRect();

console.log('Left:', rect.left);

console.log('Top:', rect.top);

console.log('Right:', rect.right);

console.log('Bottom:', rect.bottom);