http://wbex.ru/index.php?action=history&feed=atom&title=JavaScript_Tutorial%2FjQuery%2FUI_Progessbar
JavaScript Tutorial/jQuery/UI Progessbar - История изменений
2026-04-04T12:20:08Z
История изменений этой страницы в вики
MediaWiki 1.30.0
http://wbex.ru/index.php?title=JavaScript_Tutorial/jQuery/UI_Progessbar&diff=9603&oldid=prev
Admin: 1 версия
2010-05-26T08:25:12Z
<p>1 версия</p>
<table class="diff diff-contentalign-left" data-mw="interface">
<tr style="vertical-align: top;" lang="ru">
<td colspan="1" style="background-color: white; color:black; text-align: center;">← Предыдущая</td>
<td colspan="1" style="background-color: white; color:black; text-align: center;">Версия 08:25, 26 мая 2010</td>
</tr><tr><td colspan="2" style="text-align: center;" lang="ru"><div class="mw-diff-empty">(нет различий)</div>
</td></tr></table>
Admin
http://wbex.ru/index.php?title=JavaScript_Tutorial/jQuery/UI_Progessbar&diff=9602&oldid=prev
в 18:52, 25 мая 2010
2010-05-25T18:52:57Z
<p></p>
<p><b>Новая страница</b></p><div>==30. jQuery UI Progressbar - Animated==<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="javascript"><br />
<!--<br />
jQuery UI Effects Blind 1.7.2<br />
<br />
Copyright (c) 2009 AUTHORS.txt (http://jqueryui.ru/about)<br />
Dual licensed under the MIT (MIT-LICENSE.txt)<br />
and GPL (GPL-LICENSE.txt) licenses.<br />
<br />
<br />
--><br />
<!doctype html><br />
<html lang="en"><br />
<head><br />
<title>jQuery UI Progressbar - Animated</title><br />
<link type="text/css" href="js/themes/base/ui.all.css" rel="stylesheet" /><br />
<script type="text/javascript" src="js/jquery-1.3.2.js"></script><br />
<script type="text/javascript" src="js/ui/ui.core.js"></script><br />
<script type="text/javascript" src="js/ui/ui.progressbar.js"></script><br />
<link type="text/css" href="js/demos.css" rel="stylesheet" /><br />
<style type="text/css"><br />
.ui-progressbar-value { background-image: url(images/pbar-ani.gif); }<br />
</style><br />
<script type="text/javascript"><br />
$(function() {<br />
$("#progressbar").progressbar({<br />
value: 59<br />
});<br />
});<br />
</script><br />
</head><br />
<body><br />
<div class="demo"><br />
<div id="progressbar"></div><br />
</div><!-- End demo --><br />
<div class="demo-description"><br />
<p><br />
This progressbar has an animated fill by setting the<br />
<code>background-image</code><br />
on the<br />
<code>.ui-progressbar-value</code><br />
element, using css.<br />
</p><br />
</div><!-- End demo-description --><br />
</body><br />
</html></source><br />
<br />
<br />
<br />
==30. jQuery UI Progressbar - Default functionality==<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="javascript"><br />
<!--<br />
jQuery UI Effects Blind 1.7.2<br />
<br />
Copyright (c) 2009 AUTHORS.txt (http://jqueryui.ru/about)<br />
Dual licensed under the MIT (MIT-LICENSE.txt)<br />
and GPL (GPL-LICENSE.txt) licenses.<br />
<br />
<br />
--><br />
<!doctype html><br />
<html lang="en"><br />
<head><br />
<title>jQuery UI Progressbar - Default functionality</title><br />
<link type="text/css" href="js/themes/base/ui.all.css" rel="stylesheet" /><br />
<script type="text/javascript" src="js/jquery-1.3.2.js"></script><br />
<script type="text/javascript" src="js/ui/ui.core.js"></script><br />
<script type="text/javascript" src="js/ui/ui.progressbar.js"></script><br />
<link type="text/css" href="js/demos.css" rel="stylesheet" /><br />
<script type="text/javascript"><br />
$(function() {<br />
$("#progressbar").progressbar({<br />
value: 37<br />
});<br />
});<br />
</script><br />
</head><br />
<body><br />
<div class="demo"><br />
<div id="progressbar"></div><br />
</div><!-- End demo --><br />
<br />
<div class="demo-description"><br />
<p>Default determinate progress bar.</p><br />
</div><!-- End demo-description --><br />
<br />
</body><br />
</html></source><br />
<br />
<br />
<br />
==30. jQuery UI Progressbar - Resizable==<br />
<br />
<br />
<br />
<br />
<!-- start source code --><br />
<br />
<source lang="javascript"><br />
<!--<br />
jQuery UI Effects Blind 1.7.2<br />
<br />
Copyright (c) 2009 AUTHORS.txt (http://jqueryui.ru/about)<br />
Dual licensed under the MIT (MIT-LICENSE.txt)<br />
and GPL (GPL-LICENSE.txt) licenses.<br />
<br />
<br />
--><br />
<!doctype html><br />
<html lang="en"><br />
<head><br />
<title>jQuery UI Progressbar - Resizable</title><br />
<link type="text/css" href="js/themes/base/ui.all.css" rel="stylesheet" /><br />
<script type="text/javascript" src="js/jquery-1.3.2.js"></script><br />
<script type="text/javascript" src="js/ui/ui.core.js"></script><br />
<script type="text/javascript" src="js/ui/ui.progressbar.js"></script><br />
<script type="text/javascript" src="js/ui/ui.resizable.js"></script><br />
<link type="text/css" href="js/demos.css" rel="stylesheet" /><br />
<script type="text/javascript"><br />
$(function() {<br />
$("#progressbar").progressbar({<br />
value: 37<br />
});<br />
$("#progressbarWrapper").resizable();<br />
});<br />
</script><br />
</head><br />
<body><br />
<div class="demo"><br />
<div id="progressbarWrapper" style="height:30px; " class="ui-widget-default"><br />
<div id="progressbar" style="height:100%;"></div><br />
</div><br />
</div><!-- End demo --><br />
<div class="demo-description"><br />
<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><br />
</div><!-- End demo-description --><br />
</body><br />
</html></source></div>