55 lines
1.7 KiB
JavaScript
55 lines
1.7 KiB
JavaScript
// Typing animation for hero title
|
|
(function () {
|
|
const typingElement = document.querySelector('.typing-text');
|
|
if (!typingElement) return;
|
|
|
|
// Apply gradient styling
|
|
typingElement.style.background = 'linear-gradient(135deg, #fff, #ccc)';
|
|
typingElement.style.webkitBackgroundClip = 'text';
|
|
typingElement.style.backgroundClip = 'text';
|
|
typingElement.style.webkitTextFillColor = 'transparent';
|
|
|
|
const names = ['Oribi Tech', 'OTS Signs'];
|
|
let currentNameIndex = 0;
|
|
let currentCharIndex = 0;
|
|
let isDeleting = false;
|
|
let isPaused = false;
|
|
|
|
function type() {
|
|
const currentName = names[currentNameIndex];
|
|
|
|
if (isPaused) {
|
|
setTimeout(type, 2000); // Pause for 2 seconds
|
|
isPaused = false;
|
|
return;
|
|
}
|
|
|
|
if (isDeleting) {
|
|
// Erase character
|
|
currentCharIndex--;
|
|
typingElement.textContent = currentName.substring(0, currentCharIndex);
|
|
|
|
if (currentCharIndex === 0) {
|
|
isDeleting = false;
|
|
currentNameIndex = (currentNameIndex + 1) % names.length;
|
|
setTimeout(type, 500); // Pause before typing next name
|
|
return;
|
|
}
|
|
setTimeout(type, 50); // Erasing speed
|
|
} else {
|
|
// Type character
|
|
currentCharIndex++;
|
|
typingElement.textContent = currentName.substring(0, currentCharIndex);
|
|
|
|
if (currentCharIndex === currentName.length) {
|
|
isPaused = true;
|
|
isDeleting = true;
|
|
}
|
|
setTimeout(type, isDeleting ? 2000 : 100); // Typing speed
|
|
}
|
|
}
|
|
|
|
// Start the animation
|
|
type();
|
|
})();
|