개발자의 길

[html5]meter 테스트 본문

7. HTML5

[html5]meter 테스트

자르르 2012. 1. 13. 12:01



참고 자료 :

http://dev.w3.org/html5/markup/meter.html#meter

소스

<script>

var nTimerID;
var nValue;
function on_Start()
{
nValue=0;
nTimerID=setInterval(on_Progress,100);
}

function on_Progress()
{
nValue+=10;
if(nValue>500)
{
clearInterval(nTimerID);
}

document.getElementById("mtr_1").value=nValue;
}
</script>
</head>

<body>
<meter id="mtr_1" min="0" max="500" value="0" low="50" high="300" style="width:500px">
</meter><br/>
<meter min="0" max="500" value="40" low="50" high="300" style="width:500px">
</meter><br/>
<meter min="0" max="500" value="60" low="50" high="300" style="width:500px">
</meter><br/>
<meter min="0" max="500" value="350" low="50" high="300" style="width:500px">
</meter><br/>
<meter min="0" max="500" value="500" low="50" high="300" style="width:500px">
</meter><br/>

<input id="btn_Start" type="button" value="시작" onClick="on_Start()" /><br/>
</body>

실행화면



이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.
공유하기 링크
Comments