jQuery bar skrol plug-in nanoscroller panduan penggunaan_jquery

Apabila laman web memaparkan maklumat, jika jumlah maklumat terlalu besar, terdapat tiga penyelesaian utama. 1. Paging, paparan maklumat dalam halaman. 2. Keseluruhan halaman dipaparkan, tetapi halaman itu terlalu panjang, yang menjejaskan pengalaman menyemak imbas. 3. Gunakan bar skrol, tetapi gaya bar skrol lalai terlalu tunggal dan pengalaman pengguna tidak mesra. Jadi kita perlu mencantikkan bar skrol.

Cara termudah untuk mencantikkan bar skrol ialah menggunakan pemalam jquery Artikel ini memperkenalkan pemalam skrol bar skrol dalam pemalam jquery.

Paparan rasmi, gaya boleh disesuaikan

1. Fungsi pemalam penatal nano

Laksanakan fungsi menatal untuk kandungan

alamat rasmi 2.nanoscroller

http://jamesflorentino.github.io/nanoScrollerJS/

3. Cara menggunakan nanoscroller

1. Fail rujukan

<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript" src="jquery.nanoscroller.js"></script>
<link rel="stylesheet" href="nanoscroller.css">

2. Tentukan gaya bar skrol

.nano { background: #bba; width: 500px; height: 500px; font-size:12px;font-family:微软雅黑;border-radius:8px; }
.nano .content { 
  padding: 20px;
}
.nano .pane {
  background: #555;
  width: 8px;
  right: 1px;
 margin: 5px;
}
.nano .slider {
  background: #111;
}

3. Tatal kandungan yang dipaparkan

<div id="about" class="nano">
 <div class="content"> 
   滚动显示的内容
  </div>
</div>

Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.