In
this post Asp.Net jQuery UI Progress Bar Background Color, we shall
see on how to set the Background Color of a jQuery UI Progress Bar control
in an Asp.net page.
Add DIV tag to the page and add the below
jQuery script. Change the references of the jQuery library files to map to your
local path, build and run the applications.
<head runat="server">
<title>jQuery UI Progress Bar </title>
<link type="text/css"
href="css/smoothness/jquery-ui-1.8.21.custom.css"
rel="Stylesheet" />
<script
type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
<script
type="text/javascript"
src="JavaScript/jquery-ui-1.8.21.custom.min.js"></script>
<link
type="text/css"
href="Stylesheet.css"
rel="Stylesheet" />
<style type="text/css">
<style type="text/css">
.ui-progressbar.barcolor .ui-progressbar-value
{ background:
lightblue; }
</style>
<script type="text/javascript">
$(document).ready(function() {
//
Progress Bar Background color
$("#divProgressBarBGColor").progressbar({
value: 50 });
$("#divProgressBarBGColor").css({background:
'#fedcba'});
});
</script>
</head>
<body>
<form id="frmSlider" runat="server">
<table>
<tr>
<td>Progress Bar Change Background color</td>
<td><div
id="divProgressBarBGColor"
style="width:200px;"></div>
</td>
</tr>
</table>
</form>
</body>
</html>
For a full example covering all possible
scenarios in using a jQuery UI Progress Bar control refer to the post Asp.net jQuery UI Progress Bar Tutorial
Related Posts
No comments:
Post a Comment