진행 표시줄 재생


<html>
	<head>
		<title>  By Roger Li</title>
		<script language="javascript">
	
	function goto(t)
	{
		t.setCapture();
		var ox=event.clientX;

		foreDiv.style.width = ox-138;
			
		t.releaseCapture();
	}
	
	function updatetime()
	{
		//   
		var unit = 500/30;
		var currentPosition = parseInt(foreDiv.style.width);
		if (currentPosition < 500)
		{
				if (currentPosition + unit > 500)
				{
						foreDiv.style.width = 500;
						point.style.left = 485;
				}
				else
				{	
					foreDiv.style.width = currentPosition + unit;
					point.style.left = currentPosition  + unit - 15;
				}
				setTimeout("updatetime()",1000);
		}
		else
		{
				foreDiv.style.width = 0;
				point.style.left = 0;
		}	
	}
	 
	</script>



	</head>
	<body onload="updatetime();">							
			<div style="HEIGHT:16px; position:absolute; left:136px; bottom:13px; width:500px; z-index:1; border:1px solid blue;">
				<table width="100%" border="0" cellspacing="0" cellpadding="0">
					<tr>
						<td width="100%" align=left valign="baseline" style="cursor:hand" onmouseout="noshowtime()" onmousemove="showtime(this)" onclick="goto(this)">&nbsp;
							<div id="foreDiv" style="background-color:lightblue;HEIGHT:16px; position:absolute; left:0px; top:0px; width:1px; z-index:1;">
							</div>
							<div id="point" style="background-color:green;HEIGHT:16px; position:absolute; left:0px; top:0px; width:15px; z-index:1;">
							</div>
						</td>
					</tr>
				</table>
			</div>	
	</body>
</html>

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

jQuery 진행 표시줄이 있는 윤방도 구현

본고는 여러분에게 jQuery가 진도표를 가진 윤방도를 실현하는 구체적인 코드를 공유하여 참고하도록 하였으며, 구체적인 내용은 다음과 같다. 1.html 모듈 2.css 모듈 3.jQuery 모듈 4. 방법 2 멋진...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

진행 표시줄 재생

좋은 웹페이지 즐겨찾기