Cara Membuat Warna Menu Blog Berbeda Tiap Halaman

Kelas Mat - Setelah kemarin kelas Mat memberikan trik cara membuat background blog berubah warna secara otomatis, maka kali ini kelas math akan membagi kan sebuah script yang berfungsi untuk merubah warna suatu elemen agar berbeda warna tiap halaman dengan cara otomatis.
Cara Membuat Warna Menu Blog Berbeda Tiap Halaman
Sebenarnya trik ini bisa di gunakan untuk merubah elemen mana pun yang kita kehendaki. Hanya saja kita harus tau telebih dahulu Id atau class mana yang akan kita beri efek agar berubah warnanya secara otomatis tiap kali user pengguna melakukan reload halaman atau merefresh.

Apakah memperlambat loading blog

Menurut saya tidak begitu berpengaruh, karena scriptnya kecil dan hanya terdiri dari beberapa baris saja. Asalkan penempatannya tidak ditaruh di atas melainkan di taruh pada elemen body bisa setelah <body> atau sebelum </body>

Cara Membuatnya

Pertama tentunya, Anda harus sudah berada dalam halaman edit html tema blog anda. kemudian cari lah kode . Untuk memudahkan Anda dapat menggunakan tombol keyboard Ctrl + F lalu tuliskan </body> dan enter. Setelah ketemu, silahkan copy atau Ctrl + C kode script di bawah ini, dan letakkan/pastekan atau gunakan Ctrl + V di atas kode </body> tadi.
<script type='text/javascript'>
//<![CDATA[
function get_random_color() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++ ) {
color += letters[Math.round(Math.random() * 14)];
}
return color;
}
$(function() {
$("nav").each(function() {
$(this).css("background-color", get_random_color());
});
});
//]]></script>
Kata "nav" yang saya beri tanda, bisa anda ganti dengan id atau class elemen yang anda kehendaki. Misalnya saya ingin memberikan efek warna berubah otomatis pada area postingan, maka saya cukup mengganti "nav" dangan "#post". Untuk hasil nya anda bisa mengunjungi halaman berikut ini https://lab-myarcive.blogspot.com.
ArRahim

Terlahir untuk mengekspresikan, bukan untuk membuat terkesan

2 تعليقات

أحدث أقدم