Contoh dalam artikel ini menerangkan kod jquery untuk mensimulasikan kesan kecerunan bar kemajuan peratusan. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:
Kod telah diproses di sini supaya anda boleh melihat peratusan pemuatan dengan mudah Ini tidak diperlukan dalam penggunaan sebenar.
Tangkapan skrin kesan berjalan adalah seperti berikut:
Alamat demo dalam talian adalah seperti berikut:
http://demo.jb51.net/js/2015/jquery-mn-bfb-scroll-cha-style-demo/
Kod khusus adalah seperti berikut:
<html>
<head>
<title>jquery模拟百分比进度条</title>
<script type='text/javascript' src='jquery1.3.2.js'></script>
<style>
#loading{ background:url(bak.png) 0 0 no-repeat; width:397px; height:49px;}
#loading div{ background:url(pro.png) 0 0 no-repeat; line-height:49px;height:49px; text-align:right;}
</style>
<script type="text/javascript">
var progress_id ="loading";
function SetProgress(progress) {
if (progress) {
$("#" + progress_id +" > div").css("width",String(progress) + "%"); //控制#loading div宽度
$("#" + progress_id +"> div").html(String(progress) + "%"); //显示百分比
}
}
var i = 0;
function doProgress() {
if (i > 100) {
$("#message").html("恭喜您，歌曲上传成功！").fadeIn("slow");//加载完毕提示
return;
}
if (i <= 100) {
setTimeout("doProgress()",500);
SetProgress(i);
i++;
}
}
$(document).ready(function() {
doProgress();
});
</script>
</head>
<body>
<div id="message"></div>
<div id="loading"><div>
</body>
</html>Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan jQuery.
Apakah pemalam jquery?
Bagaimana untuk mengendalikan json dengan jquery
Bagaimana untuk memadam elemen dalam jquery
Bagaimana untuk menyatakan nilai lebar dalam css
Penggunaan kaedah jQuery hover().
jquery melaksanakan kaedah paging
Apakah elemen tersembunyi dalam jquery
Apa yang ditonjolkan dalam jquery
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
