pemalam jQuery Tocify penjana menu direktori nod dinamik dengan kod sumber download_jquery

Tocify ialah pemalam jQuery yang boleh menjana direktori nod artikel secara dinamik. Jika kita mempunyai artikel panjang dengan berbilang nod, maka Tocify boleh digunakan untuk menjana direktori artikel secara dinamik berdasarkan elemen nod Mengklik pada direktori boleh menatal ke nod yang sepadan Sudah tentu, apabila menatal halaman, struktur direktori akan berdasarkan pemantauan semasa Nod ditukar kepada keadaan direktori semasa.

Paparan kesan Muat turun kod sumber

Tocify kini menyokong dua gaya tema: Twitter Bootstrap dan jQueryUI Themeroller Kami boleh memilih salah satu gaya mengikut projek sebenar Selain itu, keperluan yang diperlukan ialah jQuery 1.7.2 dan jQueryUI Widget Factory 1.8.21. Selamat digunakan pada IE7, pelayar moden.

Perkenalkan fail CSS dan Javascript

fail css

<link type="text/css" rel="stylesheet" href="jquery.tocify.css" /> 
<link type="text/css" rel="stylesheet" href="bootstrap.css" /> 

Fail JavaScript

<script src="jquery-1.7.2.min.js"></script> 
<script src="jquery-ui-1.9.1.custom.min.js"></script> 
<script src="jquery.tocify.min.js""></script> 

Struktur HTML

Buat teg DIV, kemudian tambahkan ID atau Kelas pada teg ini, contohnya: toc

<div id="toc"></div>

Div#toc ini mempunyai kandungan kosong secara lalai Ia digunakan untuk menjana direktori artikel secara dinamik. Bagaimanakah direktori artikel mengaitkan nod artikel secara dinamik. Kami juga perlu membuat beberapa rancangan untuk nod artikel, seperti:

<div class="wrap"> 
<h1>Tocify</h1> 
<br /> 
<section> 
<h2>节点1</h2> 
<p>内容</p> 
</section> 
<br /> 
<section> 
<h2>节点2</h2> 
<p>内容</p> 
</section> 
... 
</div>

Untuk kod struktur HTML di atas, anda boleh mengubah suai fail CSS tocify untuk memenuhi keperluan visual projek anda.

Javascript

Gunakan jQuery untuk memilih elemen toc kami, dan kemudian panggil pemalam Tocify melalui kaedah tocify().

$(function() { 
$("#toc").tocify(); 
});

Dengan cara ini, jalankan halaman web dan direktori artikel dinamik akan dihasilkan.

Tetapan pilihan

Tocify menyediakan banyak tetapan pilihan, dan kami boleh menetapkan parameter pilihan yang berbeza mengikut keperluan sebenar projek. Berikut ialah pengenalan kepada pilihan parameter utama: