engler-labs/static/js/index.js

58 lines
2.0 KiB
JavaScript

window.onscroll = function () {
scrollFunction();
};
function scrollFunction() {
if (document.body.scrollTop > 80 || document.documentElement.scrollTop > 80) {
document.getElementById("navbar").style.padding = "30px 10px";
document.getElementById("logo").style.fontSize = "25px";
document.getElementById("submenu0").style.fontSize = "1.6rem";
document.getElementById("submenu1").style.fontSize = "1.6rem";
document.getElementById("submenu2").style.fontSize = "1.6rem";
} else {
document.getElementById("navbar").style.padding = "70px 10px";
document.getElementById("logo").style.fontSize = "35px";
document.getElementById("submenu0").style.fontSize = "2rem";
document.getElementById("submenu1").style.fontSize = "2rem";
document.getElementById("submenu2").style.fontSize = "2rem";
}
}
document.addEventListener("DOMContentLoaded", function () {
// The text to display
const text = "Welcome to our site!";
const container = document.getElementById("text-container");
// Function to simulate typing effect
function typeText(element, text, delay = 100) {
let index = 0;
function typeNextChar() {
if (index < text.length) {
// Append the next character
element.innerHTML += text[index];
index++;
// Call the function recursively with a delay
setTimeout(typeNextChar, delay);
}
}
// Start typing
typeNextChar();
element.style.color = "white";
// Fade in the text container after the typing effect starts
setTimeout(() => {
element.style.opacity = 1; // Make the text visible
}, delay * index);
}
// Start typing the text into the container
typeText(container, text, 150); // Adjust delay (in ms) for typing speed
setInterval(() => {
container.innerHTML = ""; // Clear the previous text
container.style.opacity = 0; // Hide the text container
typeText(container, text, 150); // Re-run the typing effect
}, 10000); // 10000ms = 10 seconds
});