기본 사용자 수준 진행률 표시줄_javascript 기술

배경에 대해 잘 모르기 때문에 여기서는 사용자가 직접 매개 변수를 입력하여 배경에서 매개 변수를 읽는 과정을 시뮬레이션하는 방법을 만들었습니다.

코드 복사 코드는 다음과 같습니다.

;
*{여백:0;}
.uInfo{너비:200px; 패딩:10px;}
h3{margin:10px 0;}
#레벨{너비:150px ; 높이: 6px; 테두리: 1px 커서:포인터;}
#le{height:6px; 배경:#f00; label{margin -left:10px;}
#showTime{display:none; color:#f00; line-height:24px; 글꼴 크기:12px;}
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 rates = floatNum.toFixed( "2" );
var toPercent;
if(percent == 1.00){
toPercent = 99;
}
else if(percent == 0.00){
toPercent = 1;
}
else{
toPercent = rates.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";
}

사용자 수준

온라인 시간: 이 레벨에 필요한 시간: 🎜 >

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.