能够自在改换款式的进度条成果,假如没有需求动画成果只要要CSS3便可,只要要简略的代码便可手动管制进度显示的比例,十分适用的成果。
javascript代码,辨别标识4种没有同百分比的进度条:
[code]
<script>
$(document).ready(function(){
$('.quarter').click(function(){
$(this).parent().prev().children('span').css('width','25%');
});
$('.half').click(function(){
$(this).parent().prev().children('span').css('width','50%');
});
$('.three-quarters').click(function(){
$(this).parent().prev().children('span').css('width','75%');
});
$('.full').click(function(){
$(this).parent().prev().children('span').css('width','100%');
});
});
</script>
[/code]
javascript代码,辨别标识4种没有同百分比的进度条:
[code]
<script>
$(document).ready(function(){
$('.quarter').click(function(){
$(this).parent().prev().children('span').css('width','25%');
});
$('.half').click(function(){
$(this).parent().prev().children('span').css('width','50%');
});
$('.three-quarters').click(function(){
$(this).parent().prev().children('span').css('width','75%');
});
$('.full').click(function(){
$(this).parent().prev().children('span').css('width','100%');
});
});
</script>
[/code]
版权声明:除非特别标注,否则均为本站原创文章,转载时请以链接形式注明文章出处。