자바스크립트끼리는 꼬이나요? 분석!분석!분석!분석!분석! 정보
자바스크립트끼리는 꼬이나요? 분석!분석!분석!분석!분석!
본문
아무리 생각해도 서로 상관없는 소스 같은데 간섭을 하니 요상합니다.
혹시 분석 잘하시는 분~! 어디가 문제를 일으키는 걸까요?
=========================================================================================
보드 뷰스킨(view.skin.php)의 하단 쯤에 있는 코드입니다.
①
<script language="JavaScript">
window.onload=function() {
resizeBoardImage(<?=(int)$board[bo_image_width]?>);
drawFont();
}
</script>
②
아래의 자바스크립트 코드를 ①의 이전에 삽입을 하면 실행이 안되고,(<head>~</head>에 삽입해도 마찬가지...)
② 이후에 삽입을 하면 실행은 되지만 이미지 크기 재조절이 안됩니다. 이 뷰스킨이 갤러리스킨이거든요... 그런데, basic스킨에서도 마찬가지였습니다...
참 희한하네요.... 대체 어디서 문제가 생기는 걸까요?
삽입하려는 코드 ========================================================================
<style type="text/css">
.menutitlebox {position:absolute;left:0;width:100%;height:0;background-color:#efefef;overflow:hidden;visibility:hidden;}
.categorytitle {position:relative;cursor:pointer;width:100%;background-color:c0c0c0;font-family:tahoma;font-size:12px;left:0;height:15;overflow:hidden;padding:0px;}
.categorytitle_o {position:relative;cursor:pointer;width:100%;background-color:#71AEF2;font-family:tahoma;font-size:14px;color:#ffffff;left:0;height:35;overflow:hidden;padding:10px;}
.categorytitle_text {position:relative;text-align:justify;margin:10px;font-family:tahoma;font-size:12px;color:#000000;overflow:hidden;height:90%;}
a:link, a:visited, a:active { text-decoration:none; color:#006699; }
a:hover { text-decoration:underline; }
</style>
<script type="text/javascript">
<!--
var object = new Array();
function Slide(N,oCont){
this.N = N;
this.S = 1.1;
this.object = new Array();
this.CObj = function (parent,N){
this.parent = parent;
this.N = N;
this.obj = parent.frm[N];
this.tit = this.obj.firstChild;
this.div = this.obj.getElementsByTagName("div")[1];
this.div.style.visibility = "hidden";
this.y0 = N * 18;
this.Y1 = this.y0;
this.obj.style.top = this.y0;
this.obj.style.height = parent.H - (parent.NF-1) * 18 - 3;
this.obj.style.visibility = "visible";
this.obj.parent = this;
this.run = false;
this.move = function(){
with(this){
dy = (y1-y0)/parent.S;
if(Math.abs(dy)>.1){
y0+=dy;
obj.style.top = Math.round(y0);
setTimeout("object["+parent.N+"].object["+N+"].move();", 16);
} else {
run = false;
if(dy>0)div.style.visibility="hidden";
else if(N>0)parent.object[N-1].div.style.visibility="hidden";
}
}
}
this.obj.onmouseover = function(){
with(this.parent){
if(!run){
run = true;
div.style.visibility="visible";
for(i=0;i<parent.NF;i++)parent.object[i].tit.className = "categorytitle";
tit.className = "categorytitle_o";
for(i=0;i<=N;i++){
parent.object[i].y1 = i*18;
parent.object[i].move();
}
for(i=N+1;i<parent.NF;i++){
parent.object[i].y1 = parent.H-(parent.NF-i)*18;
parent.object[i].move();
}
}
}
}
}
this.frm = document.getElementById(oCont);
this.H = parseInt(this.frm.style.height);
this.frm = this.frm.getElementsByTagName("span");
this.NF = this.frm.length;
for(i=0;i<this.NF;i++) this.object[i] = new this.CObj(this, i);
this.object[0].obj.onmouseover();
this.S = 10;
}
onload = function() {
object[0] = new Slide(0, "mainmenu");
}
//-->
</script>
0
댓글 8개
이렇게 해 보세요. 1번 한 후에 2번의 코드를 적되 onload를 다음과 같이 해보고 테스트해 보세요.
onload = function() {
tmp_onload = window.onload;
object[0] = new Slide(0, "mainmenu");
tmp_onload();
}
처음 것은 무시되고 나중 것이 실행 되는 거지요
onload 의 내용들을 하나로 합치세요..위에 것은 삭제
onload = function() {
object[0] = new Slide(0, "mainmenu");
resizeBoardImage(<?=(int)$board[bo_image_width]?>);
drawFont();
}
하핫.. 이런 바보 같으니... window.onload만 검색해 보고, onload는 검색을 안해 보다니....
갑자기 창피해 지는군요... ㅎㅎ
읽어 봐 주셔서 감사합니다!!!!
첫번의 window.onload는 이미지를 불러 올 때 리사이징을 목적으로 하고,
두번째의 onload는 메뉴를 동작시킬 때 메뉴에만 적용되는 걸 목적으로 하는 코드인데,
위와 같이 합쳐 버리면 문제 생기지 않을까요?
동시에 window.onload와 onload가 실행될 때 구분해서 따로 실행하는 방법은 없을까요?
위와 같은 형식으로 정의 하시면 됩니다.
load될때 호출되는 함수를 덮어 씌우시지 마시고,
추가해주시면 됩니다.
익스, 파폭 등에서 모두 동작되게 하려면.
약간 다르게 써야 하지만 그정도는 검색해 보시면 나오리라 봅니다.^^
그누보드와 영카트 이외의 질문은 자유게시판에 올리라고 관리자님이 말씀하셨습니다.
자유게시판 상단에 그렇게 적혀있죵? ㅋㅋ
이건 자바스크립트 질문으니...
미처 못 보았습니다.
사과 드립니다.
