我有这个代码:
<div class="progress">
<div class="bar" style="width: 0%;"></div>
</div>
我该怎么办,所以当我点击网站某处的按钮时,宽度会在特定时间从 0 变为 100,并给出加载进度条的效果?
谢谢。
我有这个代码:
<div class="progress">
<div class="bar" style="width: 0%;"></div>
</div>
我该怎么办,所以当我点击网站某处的按钮时,宽度会在特定时间从 0 变为 100,并给出加载进度条的效果?
谢谢。
如前所述,jQuery animate 会做到这一点。更改持续时间以适合您想要的时间
$('.bar').animate({ width: "100%" },2000);
你可以试试这个(使用jQuery ui)
$(function() {
$( "#progressbar" ).progressbar();
$('#progress').click(function(){
var progressbar = $( "#progressbar" ),
progressLabel = $( ".progress-label" );
progressLabel.show();
progressbar.progressbar({
value: false,
change: function() {
progressLabel.text( progressbar.progressbar( "value" ) + "%" );
},
complete: function() {
progressLabel.text( "Complete!" );
}
});
function progress() {
var val = progressbar.progressbar( "value" ) || 0;
progressbar.progressbar( "value", val + 1 );
if ( val < 99 ) {
setTimeout( progress, 50 );
}
}
setTimeout( progress, 10 );
});
});