0 Cara Membuat Menu Tab view JQuery

Kali ini saya mau share nih Menu tab yang menggunakan jQuery,yang dulu kan tanpa jQuery...

Ok langsung aja tanpa basa-basi ku kasih tau Cara membuat Menu Tab JQuery:


1. Login ke Acount Blogger kamu

2. Masuk ke "Tata Letak - Elemen Laman"

3. Klik "Tambah Gadget" baru dengan Type "HTML/JavaScript"

4. Masukan (copypaste) kode dibawah ini pada bagian konten:

<style type="text/css">
.blogtabs {padding: 0px !important;border: 0 solid #bbb;}
.blogtabs h2 {float: left;margin: 0 2px 4px 0;font-size: 12px;padding: 3px 5px;border: 1px solid #bbb;overflow: hidden;position: relative;background: #e0e0e0;cursor:pointer;}
html .blogtabs h2.active {background: #fff;}
.blogtabs .widget-content {border: 1px solid #bbb;padding: 10px;background: #fff;clear:both;margin:0;}
.btab, #showtabs {display:none;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script type="text/javascript" src="http://dl.dropbox.com/u/3558628/jQsimpletabs.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#showtabs').simpleBlogTab ({organictabs: 3});
});
</script>
<div id="showtabs"></div>

5. Simpan widget tanpa judul dan preview blog anda...

Keterangan:

• Widget yang berisi kode pada langkah 4 harus ditempatkan diatas widget yang akan dibuat menjadi organic tab
• Untuk mengatur berbagai hal yang berhubungan dengan tampilan jQuery Easy Organic Blogger Tabs silahkan edit atau modifikasi kode-kode CSS-nya
• Untuk mengatur jumlah tabs ubah nilai 3 pada kode organictabs. Angka 3 berarti kita akan memasukan 3 widget kedalam organic tabs

Selamat mencoba dan semoga berhasil... Happy blogging :)

sumber