首页 > 代码库 > jqueryui 进度条使用
jqueryui 进度条使用
1 <title></title> 2 <script src="../Js/NewJs_CFJ/jquery.js" type="text/javascript"></script> 3 <link href="../Js/NewJs_CFJ/jquery.ui.progressbar.css" rel="stylesheet" type="text/css" /> 4 <link href="../Js/NewJs_CFJ/jquery-ui.theme.css" rel="stylesheet" type="text/css" /> 5 6 <script src="../Js/NewJs_CFJ/jquery-ui.js" type="text/javascript"></script> 7 8 <style type="text/css"> 9 10 .ui-progressbar {11 position: relative;12 }13 .progress-label {14 position: absolute;15 text-align:center;16 font-weight: bold;17 text-shadow: 1px 1px 0 #fff;18 }19 </style>20 <script type="text/javascript">21 22 function addValue(value){23 var pro = $("#divProgerssbar");24 var proLabel = $(".progress-label"); //进度条里面文字25 26 var temp = 100;27 if (Number(value) > 100) {28 temp = Number(value);29 }30 pro.progressbar({31 value: Number(value), 32 max: temp33 34 });35 proLabel.text(pro.progressbar("value") + "%");36 37 38 }39 $(function () {40 addValue(0);41 42 $("#ss").click(function () {43 addValue(46);44 });45 $("#vv").click(function () {46 addValue(234.5);47 });48 });49 50 </script>51 </head>52 <body>53 <form id="form1" runat="server">54 <input type="button" value="sdf" id="ss" />55 <input type="button" value="sdf" id="vv" />56 <div id="divProgerssbar" style=" width:400px" >57 <div class="progress-label" style=" width:400px" >58 </div>59 </div>60 </form>61 </body>62 </html>
jqueryui 进度条使用
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。