Script Rainbow Text (Huruf Pelangi) - XWAPPER

Zaman wapbuilder dulu, script ini wajib ada atau dipakai untuk mempercantik situs WAP. silakan sedot Gan, sekedar mengenang masa lalu. Copy link, letakkan di tata letak sidebar blog anda.

<div class="difan-generator-box">
    <h3 class="difan-gen-title">Rainbow Text Generator</h3>
    
    <label>Masukkan Teks Kamu:</label>
    <input type="text" id="inputText" class="difan-input" placeholder="Contoh: xwapper..." onkeyup="generateRainbow()">
    
    <label>Hasil Preview:</label>
    <div id="previewArea" class="difan-preview">Hasil akan muncul di sini...</div>
    
    <label>Ambil Kode HTML:</label>
    <textarea id="outputCode" class="difan-textarea" readonly onclick="this.select()"></textarea>
    <p style="font-size: 11px; color: #666;">*Klik kolom kode untuk copy otomatis</p>
</div>

<style>
.difan-generator-box {
    background: #fdfdfd;
    border: 2px solid #d35400;
    padding: 20px;
    border-radius: 10px;
    font-family: sans-serif;
    max-width: 500px;
    margin: 20px auto;
}
.difan-gen-title {
    color: #d35400;
    text-align: center;
    margin-top: 0;
}
.difan-input, .difan-textarea {
    width: 100%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-sizing: border-box;
}
.difan-textarea { height: 100px; font-family: monospace; font-size: 12px; background: #eee; }
.difan-preview {
    padding: 15px;
    background: #222;
    border-radius: 5px;
    min-height: 40px;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 10px;
}
label { font-weight: bold; color: #555; }
</style>

<script>
function generateRainbow() {
    const text = document.getElementById('inputText').value;
    const colors = ['#FF0000', '#FF7F00', '#FFFF00', '#00FF00', '#0000FF', '#4B0082', '#9400D3'];
    let resultHTML = "";
    
    for (let i = 0; i < text.length; i++) {
        // Pilih warna berurutan berdasarkan index huruf
        let color = colors[i % colors.length];
        // Jika spasi, jangan kasih warna (biar rapi)
        if (text[i] === " ") {
            resultHTML += " ";
        } else {
            resultHTML += '<span style="color:' + color + '">' + text[i] + '</span>';
        }
    }
    
    document.getElementById('previewArea').innerHTML = resultHTML || "Hasil akan muncul di sini...";
    document.getElementById('outputCode').value = resultHTML;
}
</script>