本人对后台不是太了解，所以这里做成了用户自己输入参数的办法来模拟从后台读参数的过程。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content" content="text/html charset=gb2312">
<style type="text/css">
*{margin:0; padding:0;}
.uInfo{width:200px; padding:10px;}
h3{margin:10px 0;}
#level{width:150px; height:6px; border:1px solid #ccc; cursor:pointer;}
#le{height:6px; width:0;display:block; background:#f00; font-size:0;}
label{margin-left:10px;}
#showTime{display:none; color:#f00; line-height:24px; font-size:12px;}
</style>
<script type="text/javascript">
function userInfo(){
var allTime = document.getElementById("allTime").value;
var onTime = document.getElementById("onTime").value;
var level = document.getElementById("level");
var le = document.getElementById("le");
if(allTime == onTime){
le.style.width = 100+"%";
}
else if(onTime == 0){
le.style.width = 0;
}
else{
countPercent(onTime,allTime,level,le);
}
}
function countPercent(onHours,allHours,level,le){
var floatNum = onHours/allHours;
var percent = floatNum.toFixed("2");
var toPercent;
if(percent == 1.00){
toPercent = 99;
}
else if(percent == 0.00){
toPercent = 1;
}
else{
toPercent = percent.substring(2);
}
le.style.width = toPercent+"%";
var showTime = document.getElementById("showTime");
level.onmouseover = function(){
showTime.style.display = "block";
showTime.innerHTML = "在线时长:" + onHours +"/"+ allHours;
}
level.onmouseout = function(){
showTime.innerHTML = "";
showTime.style.display = "none";
}
}
</script>
</head>
<body>
<div class="uInfo">
<h3>用户等级</h3>
<p id="level"><span id="le"></span></p>
<P id="showTime"></p>
</div>
<div class="getNum">
<label>在线时间:</label><input type="text" id="onTime" /><label>本级所需时间:</label><input type="text" id="allTime" /> <input type="button" value="显示进度" onclick="userInfo()">
</div>
</body>
</html>
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码（独立后台）...
