http://hooriza.com/sample/ajaxboard_dev
...를 사용하면 지금은 잘 돌아가는 것 처럼 보입니다
(물론 버그 많습니다. 시간도 없고 새로 만들고 있어서 안 고치고 있는데... 지금 얘기하려는건 '특정한' 버그에 대해서 얘기하려고 하는 겁니다)
근데 잘 돌아가는건 글 목록이 500만개(정도) 이하로 있을때 얘기고...
500만개가 넘어가면 IE, FF, 오페라 등 여러 브라우저에 문제가 생깁니다.
일단 계속 설명하자면 위 게시판의 구현방법(용어가 너무 거창하다-_-)에 대해 말씀을 드려야합니다..
AJAX 게시판은 iframe (position:relative 인 div 등의 태그도 무방함) 안에
딱 화면에 보일만큼의 갯수의 div 태그가 position:absolute 로 들어있습니다.
그리고 게시판을 주르륵 스크롤을 시키면 화면 밖으로 나간 div 태그가
스크롤 되어서 새롭게 보이는 위치로 이동이 되어 채워 넣어집니다.
음... 뭐 구글맵 같은거랑 마찬가지입니다... 실제로 이용자가 보는 일정갯수의 엘리먼트를
사용해서 무한히 많은 엘리먼트가 있는 것처럼 보이도록 하는...
아무튼... 이렇게 div 태그를 이동시킬때는 물론 top 스타일에 일정값을 넣어서
이동시킵니다. 예를 들어 한 게시물의 세로길이가 10px 이라면...
첫번째 게시물은 top:0px; 이고
두번째 게시물은 top:10px; 이고
세번째 게시물은 top:20px; 이고 그런식입니다...
뭐 이런식으로 되있구요,
앞서 500만정도가 넘어가면 생기는 문제에 대해서 계속 얘기하면...
500만번째 게시물은 top:5천만px; 이 됩니다.
근데 왜 인지 이정도로 큰 숫자로 top 스타일을 지정해주면...
정확히 그 자리에 위치하질 않습니다;;
그래서 글의 갯수가 많으면 500만번째 게시물 이후는 삐뚤삐뚤 줄이 이상하게 잡힙니다.
이건 곧 게시판의 글이 500만개가 넘을 수 없다는 (넘어도 되긴 하지만 모양새가 아주 꼴사나워 집니다) 제한이 생긴다는 의미입니다.
그래서 이걸 어떻게 해결할까 고민을 하다가
"도저히 os(또는 브라우저) 에서 제공하는 스크롤바 기능을 사용하면 top 의 값을 높게 잡을 수 밖에 없기 때문에 해결할수 없다" 라는 결론을 내리고 아예 스크롤바를 만들어서 top 의 값이 높아지지 않게 만들어 봤습니다.
http://hooriza.com/sample/ajaxboard3/
이 링크에서 해당 중간 결과물을 확인할 수 있습니다..
만들다가... 개강도 하고 취업시즌이 되니 바빠져서 완성할 시간이 없네요...
이번에는 js 소스를 이쁘게 짜려고 노력해봤으니 그나마 예전보다 아주 쬐에에끔 보기 편해지셨을 겁니다-_-;;
ps. 이 글을 쓰고나니 브라우저에서 제공하는 스크롤바를 그냥 쓰면서 해결할 수 있는 방법이 생각났네요-_-;; 아악 스크롤바 js 힘들게 만들었는데!! ㅠㅠ
- 영양가 있는 포스팅인가요
-
(총 5분이 투표해서 3.4점)
3.4점
Trackback Address :: http://hooriza.com/trackback/801
-
Tracked from PHP를 들고 WEB2.0속을 헤매는 moondy2½NK
2006/09/26 18:18 삭제
만든사람은 ajax 보드라고 평범한 이름을 지었지만 , 내 마음대로 후리자 보드로 부르고 있는 보드를 흉내내보겠다. 후리자보드를 분석해볼려고 소스를 받아서 봤지만.. ajax의 가장큰 문제점인 난독성이 내눈을 어지럽혀 도중에 포기하고 말았다. 그래서 그냥 내맘대로 흉내를 내 보았는데.. 후리자보드 따라하기 1 을 적을때 대충 이걸 응용하면 되겟다 싶었는데, 왠걸.. 직접 구현해 보니 이런 저런 걸리는 문제가 한두개가 아니었다. 다시금 후리자 만세 /..
