Rumah > hujung hadapan web > tutorial js > Laksanakan kesan paparan bar kemajuan berdasarkan jQuery Bar Indicator plug-in_jquery

Laksanakan kesan paparan bar kemajuan berdasarkan jQuery Bar Indicator plug-in_jquery

PHP中文网
Lepaskan: 2016-05-16 15:37:33
asal
1244 orang telah melayarinya

Petunjuk Bar ialah pemalam paparan data bar kemajuan berasaskan jQuery Ia boleh digunakan dalam banyak senario seperti paparan statistik data, statistik pengundian dan kemajuan tugas. Ia mudah digunakan dan mempunyai pilihan yang kaya, dan boleh memenuhi hampir semua keperluan reka bentuk WEB pengguna berdasarkan bar kemajuan Artikel ini akan menerangkan penggunaan Penunjuk Bar dengan contoh.


HTML

Muat pertama fail js dan fail css yang berkaitan dengan jQuery dan Penunjuk Bar.

<link href="bi-style.css" rel="stylesheet" />
<script src="jquery.min.js"></script>
<script src="jquery-barIndicator.js"></script>
<script src="jquery.easing.1.3.js"></script>
Salin selepas log masuk

Disebabkan oleh penggunaan kesan penimbalan animasi, jangan lupa untuk menambah pemalam pelonggaran Anda boleh memuat turun pakej kod sumber ini. Kemudian tambahkan HTML pada :

<span id="bar">55lt;/span>
Salin selepas log masuk

Seperti yang anda lihat, nombor 55 dalam kod mewakili kemajuan yang akan dipaparkan oleh bar kemajuan ini. Nilai lalainya ialah 100. Sudah tentu, nombor ini juga boleh digunakan dalam pemalam Ditakrifkan apabila dipanggil.

jQuery

Selepas menyediakan html, kemudian mula memanggil Penunjuk Bar Hanya satu baris kod:

<script> $(&#39;#bar&#39;).barIndicator(); </script>
Salin selepas log masuk

Bukan sangat mudah, sudah tentu Untuk memenuhi keperluan projek anda, beberapa tetapan diperlukan, dan Bar Penunjuk memberikan kami banyak tetapan pilihan dan panggilan kaedah acara, seperti bar kemajuan mendatar/menegak, warna bar kemajuan, paparan berangka, pemerolehan dan penetapan semula nilai kemajuan, dsb.

Pilihan dan Kaedah

Laksanakan kesan paparan bar kemajuan berdasarkan jQuery Bar Indicator plug-in_jquery

Penunjuk Bar sangat berkuasa, dan terdapat banyak pilihan yang tidak disenaraikan di sini.

Di atas ialah kandungan paparan bar kemajuan effect_jquery berdasarkan pemalam Penunjuk Bar jQuery Untuk kandungan yang lebih berkaitan, sila beri perhatian kepada tapak web PHP Cina (m.sbmmt.com)!


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan