html5 progress

<!doctype html>
<html>
<head>
    <title>progress</title>
    <script type="text/javascript" src="javascript/jquery.js"></script>
    <script type="text/javascript">
        var currentValue = 0;//进度条当前数据
        var maxValue = 100;//进度条最大值
        var myIndex;
        $(function () {
            $('#myProgress').val(currentValue);
            $('#myProgress').attr('max',maxValue);
            myIndex = setInterval(plusValue,100);
        });
        function plusValue() {
            if (currentValue < maxValue) {
                currentValue++;
                $('#myProgress').val(currentValue);
            } else {
                clearInterval(myIndex);
                alert('加载完成');
            }
        }
    </script>
</head>
<body>
    <progress id="myProgress" ></progress>
</body>
</html>

相关文章

HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码