jquery ui progressbar简单使用deom
jquery api 和下载: http://api.jqueryui.com/progressbar/#option-value
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI Progressbar - Indeterminate Value</title> <link rel="stylesheet" href="jquery-ui.css" /> <script src="jquery-1.8.3.js"></script> <script src="jquery-ui.js"></script> <script > $(function() { $( "#progressbar" ).progressbar({ value: false }); $( "button" ).on( "click", function( event ) { var target = $( event.target ), progressbar = $( "#progressbar" ), progressbarValue = progressbar.find( ".ui-progressbar-value" ); if ( target.is( "#numButton" ) ) { progressbar.progressbar( "option", { value: Math.floor( Math.random() * 100 ) }); } else if ( target.is( "#colorButton" ) ) { progressbarValue.css({ "background": '#' + Math.floor( Math.random() * 16777215 ).toString( 16 ) }); } else if ( target.is( "#falseButton" ) ) { alert('dd'); progressbar.progressbar( "option", "value", 50 ); } }); }); </script> <style> #progressbar .ui-progressbar-value { background-color: #ccc; } </style> </head> <body> <div id="progressbar"></div> <button id="numButton">Random Value - Determinate</button> <button id="falseButton">Indeterminate</button> <button id="colorButton">Random Color</button> </body> </html>
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。