<!-- Progess bar widget, by Matthew Harvey (matt at smallish.com) -->
<!-- Licensed under a Creative Commons Attribution-Share Alike 2.5
License (
http://creativecommons.org/licenses/by-sa/2.5/) -->
<style type="text/css">
div.smallish-progress-wrapper
{
/* Don't change the following lines. */
position: relative;
border: 1px solid black;
}
div.smallish-progress-bar
{
/* Don't change the following lines. */
position: absolute;
top: 0; left: 0;
height: 100%;
}
div.smallish-progress-text
{
/* Don't change the following lines. */
text-align: center;
position: relative;
/* Add your customizations after this line. */
}
</style>
<!-- Progess bar widget, by Matthew Harvey (matt at smallish.com) -->
<!-- Licensed under a Creative Commons Attribution-Share Alike 2.5
License (
http://creativecommons.org/licenses/by-sa/2.5/) -->
<script type="text/javascript">
function drawProgressBar(color, width, percent)
{
var pixels = width * (percent / 100);
document.write('<div class="smallish-progress-wrapper" style="width: ' + width + 'px">');
document.write('<div class="smallish-progress-bar" style="width: ' + pixels + 'px; background-color: ' + color + ';"></div>');
document.write('<div class="smallish-progress-text" style="width: ' + width + 'px">' + percent + '%</div>');
document.write('</div>');
}
</script>
<a href="http://tinypic.com?ref=28ro3rs" target="_blank"><img src="http://i45.tinypic.com/28ro3rs.jpg" border="0" alt="Image and video hosting by TinyPic" /></a>
<script type="text/javascript">drawProgressBar('#00500D', 200, 60);</script>
(voilà !)
