Effet de saisie automatique | Gratuit - Par Youssef Pl

452 youssefpl

Remixer Ouvrir dans l'éditeur Plein écran Discuter Publiez votre code

Effet de saisie automatique | Gratuit - Par Youssef Pl

Recommandé

9 September 2024

Bouton de suppression animé

11 July 2024

Effet lumineux néon

14 October 2023

Tableau de bord interactif

HTML

CSS

const textElement = document.getElementById('text');
// النصوص الإنجليزية البديلة
const words = ["Welcome to our website", "We design the future", "Creativity knows no limits"];
let wordIndex = 0;
let charIndex = 0;
let isDeleting = false;
let typeSpeed = 100;

function type() {
    const currentWord = words[wordIndex];
    
    if (isDeleting) {
        textElement.textContent = currentWord.substring(0, charIndex - 1);
        charIndex--;
        typeSpeed = 50; // سرعة الحذف
    } else {
        textElement.textContent = currentWord.substring(0, charIndex + 1);
        charIndex++;
        typeSpeed = 150; // سرعة الكتابة
    }

if (!isDeleting && charIndex === currentWord.length) {
        isDeleting = true;
        typeSpeed = 2000; // مدة التوقف عند اكتمال الكلمة
    } else if (isDeleting && charIndex === 0) {
        isDeleting = false;
        wordIndex = (wordIndex + 1) % words.length;
        typeSpeed = 500;
    }

setTimeout(type, typeSpeed);
}

document.addEventListener('DOMContentLoaded', type);