Saturday 25 August 2018

Cara Membuat Teks Bercahaya (Neon) dan Berkedip di HTML

Assalamu'alaikum Wr. Wb

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

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
Share:

0 comments:

Post a Comment

Blogroll

Labels

Blog Archive