document.addEventListener("DOMContentLoaded", function () { var videoContainer = document.querySelector(".video-container"); var scrollTop = window.pageYOffset || document.documentElement.scrollTop; var scrollHeight = document.documentElement.scrollHeight; var clientHeight = document.documentElement.clientHeight; var scalingFactor = 2; // Adjust the scaling factor (2 means the video will scale from 100% to 300%) var initialScale = 1; // Adjust the initial scale value (1 means the video will start at 100 % size) var scale = initialScale + (scrollTop / (scrollHeight - clientHeight)) * scalingFactor; // Adjust the scaling effect here // Ensure the scale stays within the specified range scale = Math.max(1, Math.min(3, scale)); videoContainer.style.transform = "translate(-50%, -50%) scale(" + scale + ")"; }); document.addEventListener("scroll", function () { var videoContainer = document.querySelector(".video-container"); var scrollTop = window.pageYOffset || document.documentElement.scrollTop; var scrollHeight = document.documentElement.scrollHeight; var clientHeight = document.documentElement.clientHeight; var scalingFactor = 2; // Adjust the scaling factor (2 means the video will scale from 100% to 300%) var scale = 1