素材网 素材网

jquery制作手动调节统计百分比进度条代码

下载资源()次

阅读次数()次

发布时间:2014-07-30

jquery制作手动调节统计百分比进度条代码
分享到:

用法简介:

来源:xw素材网

jquery制作手动调节统计百分比进度条代码。
文件引用:

<script src="js/jquery-1.2.4.js"></script>
<script>
<!--tabjs begin-->
 $(function(){
	 $(".miaoshu div").css("display","none");
	 $(".c1").click(function(){
		 $(this).parent().parent().find(".miaoshu .miaoshu1").toggle(500).siblings().fadeOut();
		 })
	  $(".c2").click(function(){
		 $(this).parent().parent().find(".miaoshu .miaoshu2").toggle(500).siblings().fadeOut();
		 })
	 $(".c3").click(function(){
		 $(this).parent().parent().find(".miaoshu .miaoshu3").toggle(500).siblings().fadeOut();
		 })
	 $(".c4").click(function(){
		 $(this).parent().parent().find(".miaoshu .miaoshu4").toggle(500).siblings().fadeOut();
		 })
	 $(".c5").click(function(){
		 $(this).parent().parent().find(".miaoshu .miaoshu5").toggle(500).siblings().fadeOut();
		 })
		 
		 $(".c6").click(function(){
		 $(this).parent().parent().find(".miaoshu .miaoshu6").toggle(500).siblings().fadeOut();
		 }) 
	 <!--tabjs over-->
	 
	 <!--初始化根据数字显示进度begin-->
	 var bfb = $(".miaoshu1 .span1").text();
	 bfb =bfb*140/100;
	$(".bfb1 img").animate({width:bfb+"px"})
 var bfb = $(".miaoshu2 .span2").text();
	 bfb =bfb*140/100;
	$(".bfb2 img").animate({width:bfb+"px"})
	var bfb = $(".miaoshu3 .span3").text();
	 bfb =bfb*140/100;
	$(".bfb3 img").animate({width:bfb+"px"})
	var bfb = $(".miaoshu4 .span4").text();
	 bfb =bfb*140/100;
	$(".bfb4 img").animate({width:bfb+"px"})
	var bfb = $(".miaoshu5 .span5").text();
	 bfb =bfb*140/100;
	$(".bfb5 img").animate({width:bfb+"px"})
	var bfb = $(".miaoshu6 .span6").text();
	 bfb =bfb*140/100;
	$(".bfb6 img").animate({width:bfb+"px"})
	<!--初始化根据数字显示进度over-->
 
    <!--点击进度条调整进度_调整数字改变进度 begin-->
	 $(".bfb1").click(function(e){
		 $(this).parent().parent().find(".miaoshu .miaoshu1").fadeIn().siblings().fadeOut();
			  x=$(this).offset();
     var ep =   e.pageX - x.left;
     $(".bfb1 img").animate({width:ep+"px"});
	 var bfb = $(".miaoshu1 .span1").text();
	 bfb = ep*100/140;
	 $(".miaoshu1 .span1").text(parseInt(bfb));
			 })
     $(".miaoshu1 .span1").blur(function(){
	 var bfb = $(".miaoshu1 .span1").text();	 bfb =bfb*140/100;	$(".bfb1 img").animate({width:bfb+"px"});
		 })
		 
     $(".bfb2").click(function(e){
		 $(this).parent().parent().find(".miaoshu .miaoshu2").fadeIn().siblings().fadeOut();
			  x=$(this).offset();
     var ep =   e.pageX - x.left;
     $(".bfb2 img").animate({width:ep+"px"});
	 var bfb = $(".miaoshu2 .span2").text();
	 bfb = ep*100/140;
	 $(".miaoshu2 .span2").text(parseInt(bfb));
			 })
     $(".miaoshu2 .span2").blur(function(){
	 var bfb = $(".miaoshu2 .span2").text();	 bfb =bfb*140/100;	$(".bfb2 img").animate({width:bfb+"px"});
		 })
		 
	$(".bfb3").click(function(e){
		$(this).parent().parent().find(".miaoshu .miaoshu3").fadeIn().siblings().fadeOut();
			  x=$(this).offset();
     var ep =   e.pageX - x.left;
     $(".bfb3 img").animate({width:ep+"px"});
	 var bfb = $(".miaoshu3 .span3").text();
	 bfb = ep*100/140;
	 $(".miaoshu3 .span3").text(parseInt(bfb));
			 })
     $(".miaoshu3 .span3").blur(function(){
	 var bfb = $(".miaoshu3 .span3").text();	 bfb =bfb*140/100;	$(".bfb3 img").animate({width:bfb+"px"});
		 })
		 
	 $(".bfb4").click(function(e){
		 $(this).parent().parent().find(".miaoshu .miaoshu4").fadeIn().siblings().fadeOut();
			  x=$(this).offset();
     var ep =   e.pageX - x.left;
     $(".bfb4 img").animate({width:ep+"px"});
	 var bfb = $(".miaoshu4 .span4").text();
	 bfb = ep*100/140;
	 $(".miaoshu4 .span4").text(parseInt(bfb));
			 })
     $(".miaoshu4 .span4").blur(function(){
	 var bfb = $(".miaoshu4 .span4").text();	 bfb =bfb*140/100;	$(".bfb4 img").animate({width:bfb+"px"});
		 })
		 
		 
	 $(".bfb5").click(function(e){
		 $(this).parent().parent().find(".miaoshu .miaoshu5").fadeIn().siblings().fadeOut();
			  x=$(this).offset();
     var ep =   e.pageX - x.left;
     $(".bfb5 img").animate({width:ep+"px"});
	 var bfb = $(".miaoshu5 .span5").text();
	 bfb = ep*100/140;
	 $(".miaoshu5 .span5").text(parseInt(bfb));
			 })
     $(".miaoshu5 .span5").blur(function(){
	 var bfb = $(".miaoshu5 .span5").text();	 bfb =bfb*140/100;	$(".bfb5 img").animate({width:bfb+"px"});
		 })
		 
	$(".bfb6").click(function(e){
		$(this).parent().parent().find(".miaoshu .miaoshu6").fadeIn().siblings().fadeOut();
			  x=$(this).offset();
     var ep =   e.pageX - x.left;
     $(".bfb6 img").animate({width:ep+"px"});
	 var bfb = $(".miaoshu6 .span6").text();
	 bfb = ep*100/140;
	 $(".miaoshu6 .span6").text(parseInt(bfb));
			 })
     $(".miaoshu6 .span6").blur(function(){
	 var bfb = $(".miaoshu6 span6").text();	 bfb =bfb*140/100;	$(".bfb6 img").animate({width:bfb+"px"});
		 })
		 
 
    <!--点击进度条调整进度_调整数字改变进度 度over-->
		 
	 
		  })
</script>


   

网友评论:

评论

发表 剩余字数:20

一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家社会集体的和公民的合法权益,不得利用本站制作、复制和传播不法有害信息!

二、互相尊重,对自己的言论和行为负责。

@ 2013 xwcms.net . All Rights Reserved. xw素材网 | 备案号:晋ICP备13005902号 联系管理员
×

邮箱订阅

什么是邮箱订阅?

邮箱订阅是xw素材网为jquery爱好者与web程序员提供一项以邮箱的方式发送最新jquery资源与素材资源的模式,用户只需在左侧填写正确的邮箱用户名与邮箱地址我们将每天推荐最新优质资源到用户邮箱。当然每份邮箱都会有一个取消订阅按钮,当用户点击取消按钮时我们将会停止对用户发送邮箱资源推送。再次感谢大家对xw素材网的支持与关注。