soylenmezsmt adlı üyeden alıntı: mesajı görüntüle
Çok teşekkür ederim hocam.

ben de bir şeyler hazırladım chatgpt ile :d



<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <style>
    body {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100vh;
      margin: 0;
      background-color: #f0f0f0;
    }

    #animatedWord {
      font-size: 2em;
      font-weight: bold;
      display: flex;
    }

    .char {
      animation: colorChange 1s infinite; /* Animasyon süresi 1 saniye */
    }

    @keyframes colorChange {
      0%, 100% {
        color: red;
      }
      12.5% {
        color: #ff7f00;
      }
      25% {
        color: yellow;
      }
      37.5% {
        color: #7fff00;
      }
      50% {
        color: green;
      }
      62.5% {
        color: #00ff7f;
      }
      75% {
        color: cyan;
      }
      87.5% {
        color: blue;
      }
    }
  </style>
  <title>Word Animation</title>
</head>
<body>
  <div id="animatedWord">Merhaba Benim Adım SynthJob!</div>
  <script>
    const textElement = document.getElementById('animatedWord');
    const text = textElement.innerText;
    textElement.innerHTML = '';

    for (let i = 0; i < text.length; i++) {
      const charElement = document.createElement('span');
      charElement.classList.add('char');
      charElement.style.animationDelay = `${i * 0.1}s`; /* Her karakterin animasyon başlatma gecikmesini hızlandırmak için */
      
      // Boşluk karakterlerini dikkate al
      if (text[i] === ' ') {
        charElement.innerHTML = '&nbsp;'; // Boşluğu koru
      } else {
        charElement.innerText = text[i];
      }
      
      textElement.appendChild(charElement);
    }
  </script>
</body>
</html>