11
Assalamu'alaikum Wr. Wb

AD-ITech - Selamat malam agan-agan, kali ini saya akan share sesuatu yang berhubungan dengan HTML dan CSS.  Di sini agan-agan pasti sudah mengenal HTML dan CSS. Malam ini, yang akan saya share adalah,

Cara Membuat Teks Bercahaya dan Berkedip di HTML

Sperti contoh di bawah ini.


Bagaimana? apakah agan tertarik untuk mencoba?
Jika begitu saya akan jelaskan langkahnya.

1. Copas code berikut dibawah </head>
<style>
      h1 {
    color: #19abff;
    font-size: 40px;
    margin: 1px auto;
    text-align:center;
    text-transform:uppercase;
        }
    .neon {
    color: #FFFFFF;
    text-shadow: 0 0 5px #19abff, 0 0 10px #19abff, 0 0 20px #19abff, 0 0 45px #19abff, 0 0 40px #19abff;
    }
    </style>
*Tulisan merah berarti dapat diganti.
*# adalah kode warna. Kode warna dapat dicari di google.

2. Copas juga code berikut dibawah code yang tadi.
<script language="JavaScript1.2">
function ClearError() {return true;}
window.onerror = ClearError;
</script>
<script>
window.onload = function() {
var h1 = document.getElementsByTagName("h1")[0],
text = h1.innerText || h1.textContent,
split = [], i, lit = 0, timer = null;
for(i = 0; i < text.length; ++i) {
split.push("<span>" + text[i] + "</span>");
}
h1.innerHTML = split.join("");
split = h1.childNodes;

var flicker = function() {
lit += 0.01;
if(lit >= 1) {
clearInterval(timer);
}
for(i = 0; i < split.length; ++i) {
if(Math.random() < lit) {
split[i].className = "neon";
} else {
split[i].className = "";
}
}
}
setInterval(flicker, 100);
}
</script>
<br><br>
<h1>Contoh Teks bercahaya dan berkedip</h1>
 *Tulisan merah dapat diganti.

3. Selesai.


Membuat Teks Bercahaya dan Berkedip di HTML

4. Silahkan di save dan dicoba.
5. Jika ada kesalahan silahkan bertana di komentar.


Sekian dari saya, terima kasih..

Wassalamu'alaikum Wr. Wb

Post a Comment

  1. kalo mau bikin lama bercahaya dimana ya bang? soalnya bentar doang bercahayanya. makasih

    ReplyDelete
  2. Untuk waktunya bisa kita ubah
    }
    }
    }
    setInterval(flicker, 100);
    }

    yang 100 bisa kita ubah jadi berapa aja, makin besar angkanya makin lama gan, makasih

    ReplyDelete
  3. Min kok saya g bercahaya neon saya di android min...
    Mohon penjelasan

    ReplyDelete
  4. Min kok saya g bercahaya neon saya di android min...
    Mohon penjelasan

    ReplyDelete
  5. Min kok saya g bercahaya neon saya di android min...
    Mohon penjelasan

    ReplyDelete
  6. Min kok saya g bercahaya neon saya di android min...
    Mohon penjelasan

    ReplyDelete
  7. Min kok saya g bercahaya neon saya di android min...
    Mohon penjelasan

    ReplyDelete
  8. Saya copas keduanya kok gak terjadi apa-apa ya om?

    ReplyDelete
  9. Terima kasih infonya gan, artikelnya menarik dan sangat bermanfaat untuk membuat teks bercahaya(Neon) atau berkedip dan berkedip di HTML.
    Jangan lupa kunjungi blog saya https://randi96.mahasiswa.atmaluhur.ac.id/
    dan website kampus saya juga ya http://www.atmaluhur.ac.id/

    ReplyDelete
  10. mas kalau kedip nya jalan terus gimana yah supaya gak berhenti.trm ksih ilmu nya semoga allah yg membalasnya. amien

    ReplyDelete
  11. mas gimana supaya kedip nya jalan terus gak berhenti, trm ksh ilmunya, smoga allah yg membalasnya. amien.

    ReplyDelete

 
Top