9.3.14
27
Menciptakan Efek Pelangi Pada Text - Merah, Kuning, Hijau dilangit yang biru, nyanyian lagu waktu masih SD dahulu, hehe.!!sekarang tertuang dalam sebuah artikel yang akan saya share dipertemuan kita kali ini. Efek kedip pada text mungkin sudah tidak asing lagi buat anda, dengan menambahkan kode <blink>TEXT ANDA</blink>, sudah dapat menciptakan efek kedip pada text, namun efek ini sudah expired pada beberapa browser seperti chrome yang tidak dapat membaca kode blink.

Efek pelangi pada text tidak jauh berbeda dengan efek kedip, yang membedakan kedua efek ini hanya terletak pada kode penerapan. Ragam warna akan secara bergantian tampil pada efek pelangi, sedangkan pada efek kedip tampilannya hilang dan muncul dengan speed tanpa ada warna decoration. Dan pada MARQUEE berbeda lagi tampilannya yang dapat anda lihat DISINI

<script src="http://adcha.jw.lt/javascript/teks/pelangi/4/template"></script><font id="r1">TEKS ANDA</font><script src="http://adcha.jw.lt/javascript/teks/pelangi/4/r1"></script>

Sumber kode : Google » script text pelangi

Saya akan coba mengelola kode script diatas untuk menciptakan efek text berupa ragam warna speed highlight layaknya seperti pelangi, Kodenya saya kembangkan yang kurang lebih akan seperti ini tahap akhirnya (bismillahi.. mudah-mudahan berhasil)

Text Pelangi


TAHAP AKHIR PENYUSUNAN KODE

<style typecss="[{http://sahabatblogger77.blogspot.com}]">
  #highlight{font:bold 50px Impact,Arial,Sans-Serif;}</style>
<script language="javascript" type="text/javascript">
     var teks="TEXT ANDA"
     var speed=20

if (document.all||document.getElementById) {
     document.write('<span id="highlight">' + teks + '</span>')
     var storetext=document.getElementById? document.getElementById("highlight") :
document.all.highlight
} else document.write(text)
var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")

var r=1
var g=1
var b=1
var seq=1

function changetext() {
     rainbow="#"+hex[r]+hex[g]+hex[b]
     storetext.style.color=rainbow
}

function change() {
if (seq==6) {
b--
if (b==0)
seq=1
}
if (seq==5) {
r++
if (r==12)
seq=6
}
if (seq==4) {
g--
if (g==0)
seq=5
}
if (seq==3) {
b++
if (b==12)
seq=4
}
if (seq==2) {
r--
if (r==0)
seq=3
}
if (seq==1) {
g++
if (g==12)
seq=2
}
changetext()
}

function starteffect() {
     if (document.all||document.getElementById)
     flash=setInterval("change()",speed)
}

starteffect()
</script>


Sekarang coba lihat hasilnya pada tombol DEMO dibawah ini




Kerennnn...kan..!! hehe..
SELAMAT MENCOBA

TERIMA KASIH ATAS KUNJUNGAN SAUDARA

Judul= Menciptakan Efek Pelangi Pada Text
Ditulis oleh= Devy
Rating Blog 5 dari 5
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip (meng-Copy), baik itu sebagian atau keseluruhan isi dari artikel ini harap menyertakan link dofollow ke >>
= TERIMA KASIH =

27 komentar

  1. Dengan efek pelangi pada text akan membuat blog lebih hidup
    terima kasih sharenya...

    BalasHapus
    Balasan
    1. Seperti Losta masta membuat text hidup dengan warna jadi lebih berwarna ya?

      Hapus
  2. keren juga untuk judul benner , thx tipsnya

    BalasHapus
    Balasan
    1. judul banner maksudnya kali mas,,hehe

      Hapus
  3. Jadi kayak lampu disko ya, kalo di tempat gelap nyala tuh he...
    Keren deh :)

    BalasHapus
    Balasan
    1. biasanya dengan template dengan background gelap akan kelihatan menyalanya mas,

      Hapus
  4. wah krenne... kalo pasang script ini blog jdi tampil menawan

    BalasHapus
  5. Menarik nih Mbak Devy artikelnya, Text nya bisa warna warni
    Ijin coba Mbak terima kasih sudah berbagi :)

    BalasHapus
  6. jadi lebih menarik ya mbak..bisa warna-warni

    BalasHapus
  7. keren nih perlu dicoba, terima kasih ya artikelnya

    BalasHapus
  8. Kalo buat blog personal emang bagus mbak.. tapi apa gak alay hehe

    BalasHapus
    Balasan
    1. jika tidak ingin dipasang di blog atau sidebar,boleh jadi pilihan untuk banner kan mas,,hehe

      Hapus
  9. Wah kreatif banget nih.. keliatan jadi lebih genjreng kalo pake efek pelangi :D

    BalasHapus
  10. keren mbak demonya, bisa menarik perhatian pembaca, hehehe :d

    makasih sharingnya :)

    BalasHapus
  11. wah jadi berwarna warni kayak parpol hehe.....

    BalasHapus
  12. mantap gan , bikin berat blog ga yah??

    BalasHapus
    Balasan
    1. mungkin jika ditambah dengan beban bisa jadi blognya juga ikutan berat,hehe

      kodenya kan bisa dikompres mas.diedit lagi atau diperpendek tampilan warnanya

      Hapus
  13. scripnya sudah saya beri tanda dengan warna lime mas,jadi mas bisa setting warna yang sesuai agar tidak silau dimata

    BalasHapus
  14. jadi lebih keren ya kak kalau teks ada efek pelangi nya. Menarik sekali untuk dicoba tips nya ;)

    BalasHapus
  15. pasti keren kalau ada efeknya kayak gitu ya pada tulisan

    BalasHapus
  16. Dari penampilan warnanya keren Mba, dan bisa di setting lagi. :D

    Salam

    BalasHapus
  17. keren effectnya :D

    makasih buat tutornya mbak..

    mampir ya http://nandarious.com

    BalasHapus
  18. Wahh... cantik banget nie! :D

    BalasHapus
  19. wow blog keren makasih ifonya kk

    BalasHapus
  20. keren keren
    mksh info ya mba

    BalasHapus

  • Design
    X
    Teks menu masih dalam tahap perbaikan, Untuk sementara Anda akan dialihkan ke link HOME. Terimakasih.!

    KLIK
  • JQuery
    X
    Teks menu masih dalam tahap perbaikan, Untuk sementara Anda akan dialihkan ke link HOME. Terimakasih.!

    KLIK
  • CSS
    X
    Teks menu masih dalam tahap perbaikan, Untuk sementara Anda akan dialihkan ke link HOME. Terimakasih.!

    KLIK
  • HTML
    X
    Teks menu masih dalam tahap perbaikan, Untuk sementara Anda akan dialihkan ke link HOME. Terimakasih.!

    KLIK
  • JavaScript
    X
    Teks menu masih dalam tahap perbaikan, Untuk sementara Anda akan dialihkan ke link HOME. Terimakasih.!

    KLIK