Question

如何修改以下代码，以便在进度条在后台运行时，我可以在框内添加居中的“loading ...”消息？ IE浏览器。当进度条在DIV内部的背景中运行时，它会在框的中心显示LOADING ...“。

<!DOCTYPE html>
<html>
<head> 

<script type="text/javascript">  
var prg_width = 200;  
var progress_run_id = null; 

function progress() {  
var node = document.getElementById('progress');  
    var w  = node.style.width.match(/\d+/);

    if (w == prg_width) {  
        clearInterval( progress_run_id ); 
        w = 0;
        alert("done")
    } else { 
        w = parseInt(w) + 5 + 'px';          
    } 
    node.style.width = w; 
}

function runit() { 
    progress_run_id = setInterval(progress, 30); 
} 

</script>  
</head>  
<body>  
        <div style="border: 1px solid #808080; width:200px; height:20px;">  
        <div id="progress" style="height:20px; width:0px; background-color:#DBDBDB;"/>  
        </div>  
        </div>
        <p><a href="javascript:runit()">Start</a></p>
</body>  
</html>

Answer 1

    <div style="border: 1px solid #808080; width:200px; height:20px;">  
    <div id="progress" style="text-align: center; height:20px; width:0px; background-color:#DBDBDB;"/>

    <div style="  position: fixed;   left: 92px ">loading</div>


    </div>  
    </div>

在进度条中添加居中的“loading ...”消息

1 个答案: