more changes to js
This commit is contained in:
parent
3a52dd108a
commit
e03eaaa048
@ -3,26 +3,15 @@ document.addEventListener('DOMContentLoaded', function () {
|
||||
var h1 = document.querySelector('.user-index-h1');
|
||||
var h2 = document.querySelector('.user-index-h2');
|
||||
|
||||
// Function to check if an element is in the viewport
|
||||
function isInViewport(element) {
|
||||
var rect = element.getBoundingClientRect();
|
||||
return (
|
||||
rect.top >= 0 &&
|
||||
rect.left >= 0 &&
|
||||
rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
|
||||
rect.right <= (window.innerWidth || document.documentElement.clientWidth)
|
||||
);
|
||||
}
|
||||
|
||||
// Function to handle the scroll event
|
||||
function handleScroll() {
|
||||
if (isInViewport(headerText)) {
|
||||
h1.classList.add('visible');
|
||||
h2.classList.add('visible');
|
||||
} else {
|
||||
h1.classList.remove('visible');
|
||||
h2.classList.remove('visible');
|
||||
}
|
||||
// Calculate the opacity based on the scroll position
|
||||
var scrollFraction = window.scrollY / (document.documentElement.scrollHeight - window.innerHeight);
|
||||
var opacity = 1 - scrollFraction;
|
||||
|
||||
// Apply the opacity to the elements
|
||||
h1.style.opacity = opacity;
|
||||
h2.style.opacity = opacity;
|
||||
}
|
||||
|
||||
// Attach the handleScroll function to the scroll event
|
||||
|
Loading…
Reference in New Issue
Block a user