<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>进度条</title>
<style type="text/css">
body{
text-align:center
}
.graph{
width:450px
border:1px solid #F8B3D0
height:25px
}
#bar{
display:block
background:#FFE7F4
float:left
height:100%
text-align:center
}
#barNum{
position:absolute
}
</style>
<script type="text/javascript">
function $(obj){ //封装方法，相当于jQuery
return document.getElementById(obj)
}
function go(){
$("bar").style.width = parseInt($("bar").style.width) + 1 + "%"
$("bar").innerHTML = $("bar").style.width
if($("bar").style.width == "100%"){
window.clearInterval(bar) //进度为100时清除定时器
}
}
var bar = window.setInterval("go()",50) //设置定时器
window.onload = function(){
bar
}
</script>
</head>
<body>
<div class="graph">
<strong id="bar" style="width:1%"></strong>
</div>
</body>
</html>
var jsload = {img: [ 'about.png', 'applyBtn.png', 'background2.png', 'bgImg.png', 'bird.cman.png', 'borad2.png',
'choujiang.png','entry.png','f_0.png','f_1.png','f_2.png','f_3.png',
'f_4.png','f_5.png','f_6.png','f_7.png','f_8.png','f_9.png',
'fxFBfont.png','ground.2.png','logo.png','pgBar.png','pgBg.png','pipe2.png',
'raffle.png','rank.png','rankBtn.png','ruleBtn.png','shareButton.png',
'shareImg.png','sureBtn.png','tap.png','titleImg.png','trymore.png'
],
count: 1,
go: 1,
init: function () {
var _this = this
$.get('dom.txt', function (response) {
$('#gameDiv').append(response)
_this.move()
})
this.count += this.img.length
this.go = this.count
this.loadImg()
},
loadImg: function () {
for (var i = 0i <this.img.lengthi++) {
var img = new Image()
var _this = this
img.onload = function () {
_this.move()
}
img.src = 'resource/assets/' + this.img[i]
}
return this
},
move: function () {
--this.go
var press = Math.round((this.count - this.go) / this.count * 100)
console.log('游戏加载进度', press)
// if(press === 100){
// start.init()
// }
}
}
jsload.init()
图片 和txt加载 可以参考下
s[0].style.width = 100 - r / i * 100 + "%"该代码不就是设置进度条的么
如果你能更改页面 你在标签中这样写：
<h5>(资料完整度<span id="wz_jd"></span>)</h5>然后在你的JS中
s[0].style.width = 100 - r / i * 100 + "%"的下面 写上:
document.getElementById("wz_jd").innerHTML = 100 - r / i * 100 + "%"不就OK了么
注意:你的JS中哪儿有那行代码 就在那行下面 追加
如果不能更改页面就在那行代码下面 这样写：
document.getElementsByTagName("h5")[0].innerHTML = "(资料完整度"+ (100 - r / i * 100) + "%)"里面的0 表示是第1个h5标签 如果你有多个 自己进行更改
