Membuat javascript random teks

Javascript jQuery sitemap Trik Widget

Random teks adalah sebuah tulisan atau kutipan tertentu yang di tampilkan secara acara acak ketika halaman telah sepenuhnya di muat, trik random teks ini cocok untuk membuat sebuah kutikan atau tulisan tertentu yang ingin anda tampilkan secara berbeda dan saya menerapkan trik ini pada tips di blog ini. untuk lebih jelasnya silahkan anda klik link tips pada menu navigasi di atas header blog ini dan ketika anda memuat kembali halaman di blog ini maka teksnya pun akan berganti secara acak.

pastikan template anda sudah terpasang

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript">

cara membuat random teks ini tidak sulit, kita hanya perlu menggunakan sedikit javascript yang juga tidak memberatkan load atau waktu muat halaman dan scriptnya adalah sebagai berikut:

<script type='text/javascript'>
//javascript quote in arrays db
quote = new Array(5);
quote[0] = "<b>tulisan disini</b>";
quote[1] = "<b>tulisan disini</b>";
quote[2] = "<b>tulisan disini</b>";
quote[3] = "<b>tulisan disini</b>";
quote[4] = "<b>tulisan disini</b>";
//menentukan random index
index = Math.floor(Math.random() * quote.length);
//menampilkan quote
document.write("\n");
document.write(quote[index]);
//db end arrays
</script>

cara untuk menempatkan tulisan atau kutipan yang ingin anda tampilkan silahkan lihat pengaturan di bawah ini:

quote = new Array(5); :
Kalau ingin menambah 10 atau 100 tips rubah saja script kodenya quote = new Array(10); atau quote = new Array(100); dan buat daftar quote[0] = "tulisan disini"; sampai dengan quote[100] = "tulisan disini";
quote :
bisa anda ubah dengan kata misalnya bijak, puisi, tips kutipan dll.
tag :
pada tag ini bisa juga di gantikan dengan class atau id tertentu.
Penting :
Selain kode di atas, anda tidak perlu merubah kode lainnya.
silahkan menempatkannya di widget sobat dalam kotak javacsript atau html dan lihat hasilnya.

untuk menerapkannya dalam bentuk lain, silahkan saja sobat coba bereksperimen sendiri, semoga berguna...

Artikel Terkait

  • Membuat show hide konversi kode dan emoticon
    Salam buat agan agin sobat blogger yang suka utak atik template, kali ini saya mau share cara membuat show hide konversi kode dan emoticon pada komentar blogger bagi anda yang sedang mencari trik ini silahkan saja untuk di simak. pertama buka editor template blogger lalu tambahkan css di bawah ini .box-konvert-kode-db { width:100%; …
  • Memasang kode, gambar dan video di komentar
    Buat agan yang bingung dengan judul di atas sebenarnya adalah judul tentang cara menyisipkan dan mengijinkan kode, gambar dan video di komentar blogger. jadi kali ini kita akan membahas hal tersebut, karena saya pernah berkunjung ke sebuah blog yang memasang tool konversi kode tapi tidak memasang javascript ini jadi percuma juga menggunakan to…
  • Pencarian dengan tombol bersihkan
    Salah satu yang membuat blog kita menjadi user friendly adalah dengan adanya kotak pencarian, Kotak pencarian ini sangat penting untuk memudahkan pengunjung menjelajahi blog Anda atau mencari artikel lainnya di blog Anda. Fungsi kotak pencarian untuk saya sendiri adalah untuk mempermudah mencari posting yang akan saya tambahkan sebagai link i…
  • Cara membuat judul header untuk tag pre
    Selamat malam sobat blogger kali ini saya mau berbagi tentang cara dan trik membuat judul pada tag pre demo lihat blog ini, biar blognya tambah keren dan terlihat bagus. untuk demo dan hasilnya silahkan lihat di blog ini. cara dan langkahnya cukup mudah silahkan saja ikuti trik di bawah ini. pertama silahkan buka editor template blogger sobat…
  • Pemahaman dasar tentang responsive template
    Bagi para blogger template responsive kini sedang banyak diminati dan di bangun agar menambah optimalisasi tampilan pada seluruh resolusi yang memuat. website besar dan web - web ternama sudah menerapkan ini untuk menunjang tampilan mereka pada setiap resolusi walau pun masih ada pendapat bahwa responsive hanya berguna untuk web atau blog yang…
  • Blogger template De-blue responsive
    Kembali saya share template blogger yang pernah saya pakai untuk anda yang sedang mencari template silahkan di gunakan dan di simpan sesuka anda tentunya tanpa syarat apa pun. template ini sudah di lengkapai beberapa tool yang sedang di minati para blogger yaitu Fitur template Valid HTML5 Responsive Top menu Hightlight current menu Thread …

2 komentar

  1. kalo kebnyakan java script kata nya blog kita bisa berat ya mas loading nya...

    BalasHapus
    Balasan
    1. tergantung fungsinya sob, ini cuma script kecil :)

      Hapus
Kode klik emo: :) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT
:) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p
Jika anda memiliki bahasan atau topik lain yang sama sekali tidak ada hubungan dengan tutorial diatas anda bisa menyampaikannya di halaman OOt. klik [link ini] untuk membuka halaman OOT.

Back to Top
Loading...