2012-09-19 80 views
-1

如何修改下面的代碼,以便在進度條運行時能夠在框中添加居中的「加載...」消息的背景? 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> 

回答

0
<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>