Selamat datang di blog saya , pada kesempatan kali ini saya akan membahas tentang daftar isi jQuery . Cara membuat daftar isi dengan jquery yang satu ini ternyata banyak disukai oleh para blogger sejati. karena dengan daftar isi ini sangat keren dan simpel untuk dilihat. juga disamping itu tampilan ini juga lebih diminati oleh para blogger, dari pada daftar isi dengan fungsi scroll lihat gambar di samping tampilan daftar isi! lebih keren bukan , ok tak usah panjang lebar penjelasannya karna saya yakin anda sudah tak sabar untuk mencoba daftar isi jquery.

Ok, ikuti lanhkah langkah , di bawah ini :
1. login ke blog anda.
2. Klik Design/Rancangan
3. Edit HTML.
4. Kemudian letakan kode dibawah ini di atas kode ]]></b:skin>

#dafis-acc{
font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#333;
background:#ffffff;
}
.dafis-label {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA32C9iqQKocAPjmMJA_P7Mt7bYSJ_fXWC0bFvvUSngcK6cR8S0IC2w7wFt5ee7EdfshmI8ScHk1jQdoay5NzeW1YZDxN1oWn3fcN852U66u9m_5zXdK1m9xz4TAMlKZQ7U9MZbXD8wFM/d/bg4.gif") repeat-x scroll 0 0 #E1F4FB;
border: 1px solid #2F94BA;
color: #FFFFFF;
cursor: pointer;
font-weight: bold;
line-height: 1.4em;
margin: 1px 3px;
outline: medium none;
overflow: hidden;
padding: 2px 10px;
text-decoration: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
vertical-align: baseline;
white-space: nowrap;
}
.dafis-label:hover {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3aZ1f7q85cKVpW8xPNSPQOb-PiWpZDqzCNOOR1BJLeAGLgsxS5Qh7NtQfu-IruvnG3GNL1Gx-ZcnKwMt_IjWjG10Ep1i7_9DA5DhDC-LLaWfXN1LsqN6d8NFxqWOyNc6ozaWicp0_jDU/d/bg2.gif") repeat-x scroll 0 0 #E1F4FB;
color: #003366;
}
.dafis-daf ol {
margin: 0 0 0 30px !important;
padding: 0 !important;
}
.dafis-daf ol li {
background-color: #C9E9F4;
border: 1px solid #339DC6;
line-height: 1.5em;
margin: 1px 3px !important;
text-align: left;
white-space: nowrap;
}
.dafis-daf ol li a {
color: #333333 !important;
display: block;
padding-left: 10px;
text-decoration: none !important;
}
.dafis-daf ol li a:hover {
background: none repeat scroll 0 0 #7BC4DF;
border-left: 5px solid #333333;
padding-left: 5px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}


5. Copy kode dibawah ini dan letakkan diatas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

Tapi jika di blogmu sudah ada kode seperti ini maka kamu boleh meninggalkan langkah no 5 ini.

6. Jika sudah,copy dan paste kode dibawah ini,boleh kamu letakkan dalam postingan maupun widget blog kamu.

<script type="text/javascript" src="http://infonetmu.googlecode.com/files/Acc1.js"></script>
<script src="http://akangyanto.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>

7.Ganti yang berwarna merah dengan URL blogmu.Selesai.

Mudah bukan,? selamat mencoba semoga berhasil . Jangan sungkan sungkan untuk datang ke blog ini lagi , jangan lupa di komen coy. . . .he