Seperti Apa Menu Horizontal dengan Efek jQuery Ini?

Mengingat waktu yang sudah malam gan,saya share langsung kepermasalahannya aja ya.

Yup,membuat menu dengan efek memanjang ke kanan menggunakan jQuery.
Contoh sebelum di eksekusi akan tampil seperti ini:

1


2


3

Nah,untuk contoh fisiknya,sobat lihat aja di SINI

Gimana sob? tertarik,yuk intip cara membuatnya.

Langkah dan Cara Membuat Menu Horisontal dengan jQuery

Pertama,sobat pergilah ke Dashboard lalu pilih Tata Letak (gb1) kemudian pilih tab Edit HTML (gb2) dan jangan lupa contreng checklist 'Expand Widget Templates' (gb3)


(1)


(2)


(3)

Kemudian cari kode berikut (gunakan Ctrl+F untuk mempermudah pencarian):

Setelah sobat ketemukan kode tersebut,tepat diatasnya letakkan script berikut:

Kemudian cari lagi kode berikut (gunakan Ctrl+F untuk mempermudah pencarian):

]]>

Setelah kode tadi sobat ketemukan,kini tepat diATASnya letakkan barisan kode css berikut:

#menuguegitu {
width:200px;
height:50px;
background:#999999;
}

.membuatbordermelengkungroundedcorner {border: 3px solid #EFF0F1;
padding: 5px;
background: #ffffff;-moz-border-radius:5px;}

.membuatbordermelengkungroundedcorner a {background:none;}
img.float-right {margin: 5px 0px 0 10px;}
img.float-left {margin: 5px 10px 0 0px;
}

Setelah itu simpan template sobat.Untuk langkah terakhir ikuti berikut gan:

Pergilah ke Dashboard lalu pilih Tata Letak (gb1) dan klik Add Gadget (gb5) kemudian pilih HTML/Javascript (gb6),lihat gambar:


(5)


(6)

Setelah itu pilih HTML/Javascript (gb5) dan letakkan kode berikut:

Home | Index | New! | Facebook | Twitter | Google+

Simpan dan lihat hasilnya :D
Berhubung waktu sudah larut,edit sendiri ya sob sesuai dengan attribut yang sobat inginkan.See you dan Moga sukses ya nguliknya ya gan!