Sha256: ae1d766b8a40bec1411c6e17349c7539b611bc66afffd089ff4c0f924f0129c1
Contents?: true
Size: 1.2 KB
Versions: 26
Compression:
Stored size: 1.2 KB
Contents
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Progressbar - Resizable</title>
<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
<script src="../../jquery-1.8.3.js"></script>
<script src="../../ui/jquery.ui.core.js"></script>
<script src="../../ui/jquery.ui.widget.js"></script>
<script src="../../ui/jquery.ui.mouse.js"></script>
<script src="../../ui/jquery.ui.progressbar.js"></script>
<script src="../../ui/jquery.ui.resizable.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
$( "#progressbar" ).progressbar({
value: 37
});
$( "#progressbarWrapper" ).resizable();
});
</script>
</head>
<body>
<div id="progressbarWrapper" style="height:30px; " class="ui-widget-default">
<div id="progressbar" style="height:100%;"></div>
</div>
<div class="demo-description">
<p>The progress bar's widths are specified in percentages for flexible sizing so it will resize to fit its container. Try resizing the height and width of this bar to see how it maintains the correct proportions. (This is not necessarily a real-world example, but it's a good illustration of how flexibly all the plugins are coded.)</p>
</div>
</body>
</html>
Version data entries
26 entries across 26 versions & 1 rubygems