묻고답하기
misol님, 혹은 자바스크립트 잘 아시는 분 제발 도와주세요!
2010.01.21 16:23
안녕하세요...
지난번에 자바스크립트 질문한거 misol님께서 시원하게 풀어주셔서 정말 감사했습니다ㅠㅠ
사이트를 만들다가 다른 문제가 또 속을 썩여서 질문을 올립니다.
제가 줌인 효과 나는 팝업창이 윈도우 한가운데서부터 줌인되는 문서를 만들어야 되는데요.
제가 인터넷에서 본 소스는 링크를 클릭해야 줌인 효과 나는 팝업창이 뜨더라구요.
저는 링크를 클릭하게 하지 않고 페이지에 접속하면 자동으로 뜨게 할꺼거든요.
그런데 소스를 어떻게 수정해야 될지 모르겠어요.
제가 현재 사용하는 소스는 이건데요.
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
<!--
function launchCenter(url, name, width, height) {
var str = "height=" + height + ",innerHeight=" + height;
str += ",width=" + width + ",innerWidth=" + width;
if (window.screen) {
var ah = screen.availHeight - 30;
var aw = screen.availWidth - 10;
var xc = (aw - width) / 2;
var yc = (ah - height) / 2;
str += ",left=" + xc + ",screenX=" + xc;
str += ",top=" + yc + ",screenY=" + yc;
}
return window.open(url, name, str);
}
var win = launchCenter('팝업문서주소', 'center', 1000, 650);
// -->
</SCRIPT>
</head>
<body bgcolor="C6CBD1">
</body>
</html>
줌인 효과 없이 그냥 팝업창만 윈도우 한가운데 뜨는 소스예요.
그리고 제가 구한 소스는 요 밑에 있는건데, 줌인 효과는 되지만 링크를 클릭해야 팝업이 뜹니다.
그리고 윈도우 한가운데가 아니라 왼쪽으로 치우쳐서 뜨네요.
<head>
<script language="JavaScript1.2">
var maxW,maxH,fromX,fromY,toX,toY,adjX,adjY,zBox,zStep=0,zLink,zNew;
function zoomBox(evt,zlink,maxw,maxh,tox,toy) {
if (arguments.length > 2) zNew=1;
scrollH=(window.pageYOffset!=null)?window.pageYOffset:document.body.scrollTop;
maxW=maxw?maxw:window.innerWidth?innerWidth:document.body.clientWidth;
maxH=maxh?maxh:window.innerHeight?innerHeight:document.body.clientHeight;
toX=tox?tox:0;
toY=(toy?toy:0)+scrollH;
fromX=evt.pageX?evt.pageX:evt.clientX;
fromY=(evt.pageY?evt.pageY:evt.clientY)+(document.all?scrollH:0);
adjX=toX+evt.screenX-fromX;
adjY=toY+evt.screenY-fromY;
if (document.createElement && document.body.appendChild && !zBox) {
zBox=document.createElement("div");
zBox.style.position="absolute";
document.body.appendChild(zBox);
} else if (document.all && !zBox) {
document.all[document.all.length-1].outerHTML+='<div id="zBoxDiv" style="position:absolute"></div>';
zBox=document.all.zBoxDiv;
} else if (document.layers && !zBox) {
zBox=new Layer(maxW);
zBox.style=zBox;
}
zLink=zlink;
doZoom();
}
function doZoom() {
zStep+=1;
zPct=(10-zStep)/10
if (document.layers) {
zBox.moveTo(toX+zPct*(fromX-toX),toY+zPct*(fromY-toY));
zBox.document.open();
zBox.document.write("<table width='"+maxW*(1-zPct)+"' height="+maxH*(1-zPct)+" border=2 cellspacing=0><tr><td></td></tr></table>");
zBox.document.close();
} else {
zBox.style.border="2px solid #999999";
zBox.style.left=toX+zPct*(fromX-toX);
zBox.style.top=toY+zPct*(fromY-toY);
zBox.style.width=maxW*(1-zPct);
zBox.style.height=maxH*(1-zPct);
}
zBox.style.visibility="visible";
if (zStep < 10) setTimeout("doZoom("+fromX+","+fromY+","+toX+","+toY+")",30);
else {
zBox.style.visibility='hidden';
zStep=0;
if (zLink && !zNew) location.href=zLink.href;
else if (zLink && zNew) {
var w=window.open(zLink.href,''+
'+
','width='+maxW+',height='+maxH+',left='+adjX+',top='+adjY+',scrollbars,resizable');
zNew=null;
}
}
}
</script>
<script language="JavaScript1.2">
function gotClick(arg) {
evt=arg?arg:event;
evtFrom=evt.target?evt.target:evt.srcElement;
if (evtFrom.parentNode) evtFrom=evtFrom.parentNode.href?evtFrom.parentNode:evtFrom;
if (evtFrom.href && !evtFrom.onclick) {
zoomBox(evt,evtFrom);
return false;
} else {
if (document.routeEvent) document.routeEvent(evt);
if (evtFrom.href) return false;
}
}
function getClicks() {
if (document.layers) document.captureEvents(Event.CLICK);
document.onclick=gotClick;
}
window.onload=getClicks;
</script>
</head>
<body>
<a href="팝업문서주소" onclick="zoomBox(event,this,400,300,100,100);return false>링크를 걸 텍스트나 이미지</a>
</body>
잘 응용하면 "페이지에 접속함과 동시에 윈도우 한가운데서부터 줌인 되는 팝업"을 만들 수 있을 것 같은데
초보도 왕초보인지라 어디를 어떻게 수정해야 될지 전혀 모르겠어요ㅠㅠ
겟클릭, 온클릭, 갓클릭스 이게 링크를 클릭한다는 것을 의미한다는 것 외에는...
온클릭 말고 온로드가 문서가 로드될 때를 의미하는 것 같은데 도대체 어디를 바꿔야 될 지 모르겠어요!
misol님이나 자바스크립트 잘 아시는 고수님들 혹시 이거 보시면 그냥 가지 마시고 제발 도와주세요...
이것 때문에 어젯밤부터 지금까지 인터넷 뒤지면서 연구했는데 도저히 혼자서 해결불가네요ㅠㅠ 절실합니다ㅠㅠ
답변이 없어서 포인트 회수