 |
|
| |
|
  |
16년 전
|
<html>
<head>
<script language="javascript">
Progressbar = {
initialize: function() {
var pbColl = document.getElementsByTagName("PROGRESSBAR");
for (var i=0, len=pbColl.length; i<len; i++) {
var ctlFrame = document.createElement("SPAN");
ctlFrame.style.width = pbColl[i].getAttribute("WIDTH");
ctlFrame.style.height = pbColl[i].getAttribute("HEIGHT");
ctlFrame.style.borderWidth = pbColl[i].getAttribute("BORDER");
ctlFrame.style.borderStyle = "ridge";
ctlFrame.style.backgroundColor = pbColl[i].getAttribute("BGCOLOR");
ctlFrame.style.textAlign = "left";
pbColl[i].insertAdjacentElement("afterend", ctlFrame);
var ctlBody = document.createElement("SPAN");
ctlBody.value = new Number(pbColl[i].getAttribute("VALUE"));
ctlBody.style.height = parseInt(ctlFrame.style.height) -
parseInt(ctlFrame.style.borderWidth) * 2;
ctlBody.style.width = ctlBody.value + "%";
ctlBody.style.backgroundColor = pbColl[i].getAttribute("COLOR");
ctlFrame.appendChild(ctlBody);
pbColl[i]._impl = ctlBody;
pbColl[i].setValue = function(num){this._impl.style.width = num + "%";}
}
}
}
</script>
</head>
<body onload="Progressbar.initialize()">
</body>
<h1>진행상태바 예제</h1>
형태 1:
<center>
<progressbar id=pb1 width=200 height=20 border=2 bgcolor=lightgrey color=blue value=30>
<br><br>
<input id=num1 size=3><input type=button value="Set Value (%)" onclick="pb1.setValue(num1.value)">
</center>
<br><hr><br>
형태 2:
<center>
<progressbar id=pb2 width=400 height=30 border=3 bgcolor=white color=black value=70>
<br><br>
<input id=num2 size=3><input type=button value="Set Value (%)" onclick="pb2.setValue(num2.value)">
</center>
</html> |
|
 추천 : 301 |
추천
목록
|
|
| |
|
