마우스 이벤트

운영자

| 기사입력 2008/01/13 [12:09]

javascript >

마우스 이벤트

운영자

ㅣ 기사입력

2008/01/13 [12:09]

onmousedown : 어떤 마우스 버튼이 눌려 졌을 때
onmouseup: 클리 후 원상복귀할때
MouseOver: 마우스가 위로 왔을때
onMouseOut: 마우스가 나갔을 때
<body ondragstart="return false" onselectstart="return false" oncontextmenu="javascript:alert('마우스 오른쪽버튼을 이용할 수 없습니다!');return false" >
<p><body ondragstart="return false" onselectstart="return
false"<br>
oncontextmenu="javascript:alert('마우스 오른쪽버튼을 이용할 수
없습니다!');return false" >
</p>

<DIV ID="oDiv1">1:Div #1</DIV>
<DIV ID="oDiv2">2:Div #1</DIV>
<body leftmargin=0 topmargin=0>
<script>
var posX = 0;
var posY = 0;
var posX2 = 0;
var posY2 = 0;
function action_MouseDown() {
    posX = event.x;
    posY = event.y;
    document.onmousemove = scrollPage;
}
function scrollPage() {
      posX2 = event.x;
      posY2 = event.y;
      pX = posX - posX2;
      pY = posY - posY2;
      window.scrollBy(pX,pY);
      posX = event.x;
      posY = event.y;
      event.returnValue=false;
}
function action_MouseUp() {
    document.onmousemove=null;
}
document.onmousedown = action_MouseDown;
document.onmouseup = action_MouseUp;
</script>
<img src="<?=$upload_dir."/".$img_extra?>" style="cursor:move;filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=<?=$rv?>);">

<html>
<head>
<title>이미지에 클릭후 움직이면 스크롤 됩니다. 이미지에 더블클릭 하면 닫힙니다.</title>
<meta http-equiv=Content-Type content=text/html; charset=EUC-KR>
<META HTTP-EQUIV="imagetoolbar" CONTENT="no">
</head>
<font style="height:0;">
</font>
<script language="JavaScript" src="default.js" type="text/JavaScript"></script>
<script language="javascript">
var windowX, windowY;
var bLargeImage = 0;
var x,y,mx,my;
function fitWindowSize()
{
  window.resizeTo(200, 200);
  width = 200 - (document.body.clientWidth - document.images[0].width);
  height = 200 - (document.body.clientHeight - document.images[0].height);
  windowX = (window.screen.width-width)/2;
  windowY = (window.screen.height-height)/2;
  if(width>screen.width){
   width = screen.width;
   windowX = 0;
   bLargeImage = 1;
  }
  if(height>screen.height){
   height = screen.height;
   windowY = 0;
   bLargeImage = 1;
  }
  x = width/2;
  y = height/2;
  window.resizeTo(width, height);
  window.moveTo(windowX,windowY);
}
var posX = 0;
var posY = 0;
var posX2 = 0;
var posY2 = 0;
var captureMode = false;
function MouseCheck(event,obj) {
    captureMode = captureMode ? false : true;
    posX = event.x;
    posY = event.y;
    obj.style.cursor = captureMode ? 'move' : 'pointer';
}
function scrollPage(event) {
  if(!captureMode) return;
  move = 1;
  posX2 = event.clientX;
  posY2 = event.clientY;
  pX = posX - posX2;
  pY = posY - posY2;
  window.scrollBy(pX,pY);
  posX = event.clientX;
  posY = event.clientY;
}
function move(event){
  if(bLargeImage) window.scroll(event.clientX - wx,event.clientY -wy);
  return true;
}
</script>
<body onLoad="fitWindowSize()" style='margin:0'>
<img src="http://media-bom.net/bbs/data/d_photo/_DSC0157.jpg" border="0" onDblClick='window.close()' onmousemove="scrollPage(event)" onClick="MouseCheck(event,this)" style="cursor:pointer">
</body>
</html>

트위터

페이스북

카카오톡