Select 컨트롤에 DIV 구현(IFRAME 사용)

2075 단어 UP
[color=blue] 클래식 구현 DIV가 Select 컨트롤 위에(IFRAME 이용) [/color]

<html>
		<head>
				<script>
				function DivSetVisible(state)
				{
						var DivRef = document.getElementById('PopupDiv');
						var IfrRef = document.getElementById('DivShim');
						if(state)
						{
								DivRef.style.display = "block";
								IfrRef.style.width = DivRef.offsetWidth;
								IfrRef.style.height = DivRef.offsetHeight;
								IfrRef.style.top = DivRef.style.top;
								IfrRef.style.left = DivRef.style.left;
								IfrRef.style.zIndex = DivRef.style.zIndex - 1;
								IfrRef.style.display = "block";
						}
						else
						{
								DivRef.style.display = "none";
								IfrRef.style.display = "none";
						}
				}
				</script>
		</head>
		<body>
				<form>
						<select>
						<option>A Select Box is Born ....</option>
						</select>
				</form>
				<div
						id="PopupDiv"
						style="position:absolute; top:25px; left:50px; padding:4px; display:none; background-color:#000000; color:#ffffff; z-index:100">
						.... and a DIV can cover it up<br/>through the help of an IFRAME.
				</div>
				<iframe
						id="DivShim"
						src="javascript:false;"
						scrolling="no"
						frameborder="0"
						style="position:absolute; top:0px; left:0px; display:none;">
				</iframe>
				<br/>
				<br/>
				<a href="#" onclick="DivSetVisible(true)">Click to show DIV.</a>
				<br/>
				<br/>
				<a href="#" onclick="DivSetVisible(false)">Click to hide DIV.</a>
		</body>
</html> 


좋은 웹페이지 즐겨찾기