국가별 사이트 바로가기

회원로그인

커플닷넷 게시물 내용보기

게시판 운영원칙불량회원 운영정책에 따라 문제 있는 글은 사전경고 없이 삭제될 수 있습니다.  [불량회원 신고]

[버그레포트] 해결방안:스크롤바 이동이상.
by 강성탁 (대한민국/남)  2007-02-05 00:20 공감(0) 반대(0)
hoho님~~ 링크 클릭시 스크롤바 이동 문제에 대한 최종 정리해드립니다.
개발팀에 전달해 주세요~~~~~!!
(저녁 한번 얻어먹어야 될 듯... -.-;)
----------------------------------------------------------------
[문제]
- 보통 사이즈 창에서 조금 아래로 스크롤 후 링크 걸린 사진이나
prev/next 링크 누를시 스크롤바가 위로 자동으로 이동됨.

[원인]
- 근본 원인은 이동할 target (HREF URL) 정보를 window status 영역에
표시되지 않게 하는 방법의 부작용.
- 그러나 Date 사이트의 군데군데를 보면 URL이 보이는 곳도 있고 보이지 않는 곳도
있으며 링크 작성상 일관성이 떨어지며 이 버그가 없는 곳도 있음.
- 기술적 원인은, HTML의 A태그를 사용하면서 onClick 이벤트 처리를 통해
ID등 주요 정보를 감출때, A태그의 HREF 속성에 #을 지정해주는 부분임.
예: A HREF=# onClick="javascript:popup_user_profiel();" onMouseOver=.... >

[해결방안]
1. URL 감추기 (Date 사이트에도 URL감추기가 일관적으로 적용되어 있진 않음).
1.1 아래 java script 함수를 작성 (모든 HTML 페이지에서 포함되는 js 파일이 있으면
거기에 넣고 HTML페이지의 HEAD-JavaScript 영역에서 import 시킴).
시험해 본바로는 status에 null을 넣으면 최초의 onMouseOver가 동작하지 않을 수
있으므로 공백(1 space)을 넣는 것으로 해주는게 좀 더 확실함.

function hideStatus()
{
window.status=``;
return true;
}

1.2 HTML A 태그(혹은 이동하는 button의 event쪽)에 아래 java script event 추가.

onMouseOver=`hideStatus()` onMouseOut=`hideStatus()` onFocus=`this.blur();hideStatus()`

기왕이면 위 문자열을 ASP 전역변수(commonSetStatus)에 넣고 A HREF="..." onClick="processXYZ()" $commonSetWindowStatus> 처럼 출력하면 일관성 유지가 될 겁니다.

2. 스크롤 문제 해결.
2.1 앞의 1.1과 유사한 setDummyURL() 함수를 만듭니다. 단, return true 부분을 삭제합니다.
2.2 HTML A태그의 HREF에 # 대신 setDummyURL() 호출부를 넣습니다.
A HREF=`javascript:setDummyURL();` .....>
이렇게 하면 스크롤 현상이 일어나지 않습니다.
2.3 2.2보다 더 단순한 방법도 있으며 Date 사이트의 특정 부분에 적용되어져 있습니다.
이 방법은 #대신 javascript 인 것만 적는 것입니다.
A HREF=`javascript:;` ...... >

[상세한 문제 분석]
Date 사이트의 Link 되는 부분들 보면 군데군데 틀립니다. 현재 본 것들로 정리해드립니다.
1. 마이페이지에서 프로필 조회/신입 회원 부분.
Date 로그인하면 마이페이지로 이동하고 중간에 나를 보보간 회원, 새로가입한 회원
목록이 보입니다.
여기서는 사진이 아니라 ID(생년) 부분을 클릭하게 되어 있는데 이 부분에 위에 언급한
해결방안 2.3이 있더군요.
단, more 해서 들어가면(프리데이트관리-프로필조회, 신규가입회원) 사진누르게 되어 있고
여긴 HREF=# 부분으로 되어 스크롤 문제가 일어납니다.

2. 프리데이트의 리스트에서 회원목록 아래에 나오는 [1], [2]... [10] 부분.
이 부분들은 URL은 보이지만 스크롤 문제는 일어나지 않습니다.

3. 프리데이트의 리스트 아래 [1]~[10] 좌우의 <<, >>, prev, next 부분.
이 부분들은 URL은 보이지 않지만 스크롤 문제가 일어납니다.
그런데 Date 사이트 중 이 문제가 해결된 부분이 있습니다.
상단 프리데이트 메뉴 누르자마자 나오는 리스트에는 문제가 있습니다.
그런데 마이페이지-프리데이트관리-프로필조회 에 나오는 리스트 아래의
<<, >>, prev, next 부분에는 스크롤 이상이 일어나지 않습니다.
다른 URL문제들은 위의 해결방법으로 하시고, <<, >>, prev, next 부분은
프로데이트관리-프로필조회에 적용하신 소스 기준으로 통일하시면 됩니다.

----------------------------------------------------------------

커플닷넷 게시물 댓글보기

커플닷넷 게시물 댓글쓰기

작성자 닉네임 ★ 댓글을 작성하시려면 로그인해 주세요.
▶ 댓글은 500자(1000Byte)이하로 작성가능합니다. 0 Bytes   등록
다음글
다음글[Next] :