我正在从事一个项目,该项目应该在屏幕的左侧显示一个垂直进度条,用于显示用户的进度。
我使用HTML progress元素来实现这个功能,像这样:
我的jQuery代码如下:
我使用HTML progress元素来实现这个功能,像这样:
<progress id="progressbar" value="0" max="100"></progress>
CSS:progress[value] {
/* Reset the default appearance */
-webkit-appearance: none;
appearance: none;
width: 100%;
height: 20px;
position:fixed;
z-index:10;
}
我的jQuery代码如下:
<script type="text/javascript">
$(window).scroll(function () {
var s = $(window).scrollTop(),
d = $(document).height(),
c = $(window).height();
scrollPercent = (s / (d-c)) * 100;
var position = scrollPercent;
$("#progressbar").attr('value', position);
});
</script>
是否有可能翻转进度条,使其从上往下移动?