YesYo.com MintState Forums
뒤로    YesYo.com MintState BBS > Tech > Javascript
검색
멤버이름    오토
비밀번호 
 

이미지 팝업

페이지 정보

작성자 MintState 댓글 0건 조회 10,381회 작성일 08-11-17 13:21

본문

이미지 팝업


드레그가능 더블클릭으로 닫기.

<html>
<head>
<META http-equiv=Content-Type content=text/html;charset=euc-kr>
<meta http-equiv="imagetoolbar" content="no">
<title> 마우스로 이미지를 끌어 확인하세요 </title>
<style>
.drag { position: relative; cursor:move; }
</style>

<script language="JavaScript">
<!--
var bdown = false;
var x, y;
var sElem;

function mdown(evt) {
evt = (evt) ? evt : ((window.event) ? window.event : "");
sElem = evt.target ? evt.target : evt.srcElement;

if (evt.stopPropagation) {	
	evt.stopPropagation();
	evt.preventDefault();
}
evt.returnValue  = false;
evt.cancelBubble = true;

if(sElem.className == "drag") {
  bdown = true;
  x = evt.clientX;
  y = evt.clientY;
}
}
function mup() {
bdown = false;
}

document.onmousemove = function moveimg(event) {
event = (event) ? event : ((window.event) ? window.event : "");
if(bdown) {
  var distX = event.clientX - x;
  var distY = event.clientY - y;
  var targetImg = document.getElementById('imgTomove');
  targetImg.style.left = (parseInt(targetImg.style.left) + distX) + 'px';
  targetImg.style.top = (parseInt(targetImg.style.top) + distY) + 'px';
  x = event.clientX;
  y = event.clientY;
return false;
}
}


function setSize (x,y) {
	var windowX, windowY;
		//window.resizeTo(200, 200);

		if (document.all)
		{
			width = 212 - (document.body.clientWidth -  document.images[0].width);
			height = 231 - (document.body.clientHeight -  document.images[0].height);
		} else {
			width = 208 - (document.body.clientWidth -  document.images[0].width);
			height = 249 - (document.body.clientHeight -  document.images[0].height);
		}
		
		windowX = (window.screen.availWidth-width)/2;
		windowY = (window.screen.availHeight-height)/3;
		if(width>screen.availWidth){
			width = screen.availWidth;
			windowX = 0;
		}
		if(height>screen.availHeight){
			height = screen.availHeight;
			windowY = 0;
		}
		window.resizeTo(width, height);
		window.moveTo(windowX,windowY);
}
//-->
</script>

<script type="text/javascript">
function cursor(evt)
{
	evt = (evt) ? evt : ((window.event) ? window.event : "")
	document.getElementById('trail').style.display=""
	document.getElementById('trail').style.position="absolute"
	document.getElementById('trail').style.zIndex="3"
	document.getElementById('trail').style.left=evt.clientX+10
	document.getElementById('trail').style.top=evt.clientY
}
</script>
</head>
<body style="margin:0px; padding:0px; border:0px;" bgcolor="#fbfbfb" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onmousemove="cursor(event)" ondblclick="window.close();" oncontextmenu="return false;" onload="setSize();">

<span id="trail" style="display:none; width:90px; border:1px solid #000000; padding:2px; background-color:#e5ecf9;font-family:돋움;font-size:8pt;color:#EF5900;">드레그 = 이동<br>더블클릭 = 닫기</span>
<table border=0 cellspacing=0 cellpadding=0 width="100%" height="100%">
    <tr>
    <td align=center valign=middle>
		<img id="imgTomove" style="left:0px;top:0px"onmousedown="mdown(event);" onmouseup="mup();" name="cnjimg" ondblclick="window.close();" src="http://yesyo.com/forums/image.php?u=1&dateline=1105894265" class="drag" oncontextmenu="return false;">
    </td>
  </tr>
</table>
</body>
</html>
첨부 파일
파일 종류: gif viewImgPop.gif (4.4K, 44 views)
파일 종류: rar viewImgPop.rar (5.8K, 2 views)

댓글목록

등록된 댓글이 없습니다.

Total 178건 3 페이지
Javascript 목록
번호 제목 글쓴이 조회 날짜
138 MintState 18183 11-17
137
세로롤링 댓글+ 1
MintState 15863 11-17
136 MintState 14935 11-17
135 MintState 14484 11-17
134 MintState 16119 11-17
133 MintState 16890 11-17
132 MintState 16782 11-17
131 MintState 17717 11-17
130 MintState 16723 11-17
129 MintState 14601 11-17
128 MintState 15303 11-17
127 MintState 16105 11-17
126 MintState 16302 11-17
125 MintState 19752 11-17
124 MintState 17069 11-17
123 MintState 10616 11-17
122 MintState 15925 11-17
121 MintState 16808 11-17
120 MintState 9743 11-17
열람중 MintState 10382 11-17
게시물 검색
모바일 버전으로 보기
CopyRight ©2004 - 2024, YesYo.com MintState. ™