main javascript

document.addEventListener('DOMContentLoaded', function() {
  const footer = document.querySelector('footer');
  if (!footer) {
    console.error('Footer element not found. Please ensure your footer has a <footer> tag.');
    return;
  }

  let isFooterVisible = false;
  const footerHeight = footer.offsetHeight;
  const scrollThreshold = 800; // Adjust this value to control when the footer starts moving

  function handleScroll() {
    const scrollPosition = window.scrollY || window.pageYOffset;
    const windowHeight = window.innerHeight;
    const documentHeight = document.documentElement.scrollHeight;

    // Check if the user has scrolled past a certain point and the footer isn't already fully visible
    if (scrollPosition > scrollThreshold && !isFooterVisible) {
      // Calculate the target bottom position to make the footer fully visible
      const targetBottom = 0;

      // Use a smooth animation for the transition
      let currentBottom = parseFloat(getComputedStyle(footer).bottom) || -footerHeight;
      let animationInterval = setInterval(() => {
        currentBottom += 5; // Adjust the step value to control the speed of the animation
        footer.style.bottom = `${Math.min(currentBottom, targetBottom)}px`;

        if (currentBottom >= targetBottom) {
          clearInterval(animationInterval);
          isFooterVisible = true;
        }
      }, 15); // Adjust the interval to control the smoothness of the animation
    } else if (scrollPosition <= scrollThreshold && isFooterVisible) {
      // If the user scrolls back up, slowly hide the footer
      const targetBottom = -footerHeight;
      let currentBottom = parseFloat(getComputedStyle(footer).bottom) || 0;
      let animationInterval = setInterval(() => {
        currentBottom -= 5; // Adjust the step value to control the speed of the animation
        footer.style.bottom = `${Math.max(currentBottom, targetBottom)}px`;

        if (currentBottom <= targetBottom) {
          clearInterval(animationInterval);
          isFooterVisible = false;
        }
      }, 15); // Adjust the interval to control the smoothness of the animation
    }
  }

  // Attach the scroll event listener to the window
  window.addEventListener('scroll', handleScroll);

  // Initially position the footer off-screen
  footer.style.bottom = `-${footerHeight}px`;
});
function main(){
  const inp=document.getElementById("inp");
  const output=document.getElementById("out");
  if (inp && output){
    output.textContent=inp.value;
  }else{
    console.error("Ein element wurde nicht gefunden")
  }
}