콩바구니의 그림일기

오랬만에 새로운 스킨을 만들었습니다. 저번스킨에서, 스크립트 이곳저곳을 뜯어고치고, 디자인을 조금 손본 것입니다.

이 스킨의 특징은 다음과 같습니다.

스킨의 특징

웹표준을 준수합니다. 따라서, 파이어폭스, 사파리, 오페라, 구글크롬 등의 브라우저로 접속하시면, 제가 의도한 기능이 100% 구현 됩니다.
익스플로러는 조금 깨집니다... (그나마 익스플로러8은 좀 났더군요.그래도 완벽하지는 않습니다.)

이번 스킨에서 익스플로러 6 지원을 포기했습니다. 그렇더라도 익스플로러 6에서 접속이 불가능한것은 아닙니다. 컨탠츠로 접근에 무리없습니다. 단지 그뿐입니다.

자동목차 생성기능

• 지원 브라우저 : (ie6 50%, ie7, ie8, firefox, safari, opera, chrome)

오른쪽 상단을 보면  요로코롬 생긴 버튼이 있습니다. 제목태그인 <H1>~<H6> 까지의 태그에 대한 정보를 자바스크립트에서 읽어들어서, 그 INDEX 를 생성하는 기능입니다. 이 버튼을 누르면 페이지 전채의 구조를 한눈에 볼수 있습니다.

 <- 이런식의 목차가 생성됩니다. 목차안의 내용은 전부 책갈피 기능을 하는 하이퍼링크라서, 원하는 위치로 바로 이동할수 있습니다.

익스플로러6이상 작동합니다. 

Color Theme

• 지원 브라우저 : (ie8, firefox, safari, opera, chrome)

5가지 색상의 태마로 변신합니다.

오랜지, 청색, 분홍색, 회색, 녹색, 무작위 선택의 6가지 옵션이 있습니다.

익스플로러8 이상에서 정상작동합니다.

풍선도움말 

• 지원 브라우저 : (ie7 50%, ie8 80%, firefox, safari, opera, chrome)

alt 나 title 속성을 읽어와서 말풍선으로 나타납니다. 팬시툴팁 이라고 할까요.

title 이 있으면 이렇게 나오고,

alt 가 있으면 이렇게 나옵니다.

익스플로러7이상 동작합니다. 익스플로러 7에서는 말풍선의 레이아웃이 조금 깨지는 현상이 보입니다. 좌표도 많이 어긋납니다. 익스플로러8에서는 가로좌표가 어긋나는 현상이 있습니다.

자동각주 기능

• 지원 브라우저 : (ie6 80%, ie7, ie8, firefox, safari, opera, chrome)

<abbr title="용어설명">전문용어</abbr>

본문중에 이러한 마크업이 있으면, 그것을 정리하여 하단에 각주를 그 위치로 가는 하이퍼링크와 함깨 생성합니다. 이 기능은 익스플로러 6에서도 작동합니다.

사이드바 접는 기능

• 지원 브라우저 : (ie7, ie8, firefox, safari, opera, chrome)

이렇게 생긴 버튼을 눌러서 사이드바를 접거나 펼칠수 있습니다. 익스플로러7에서는 잘 작동하지만, 익스플로러8에서는 한번접히면 다시 안펴지는 버그가 있습니다. 아마 배타버전이라서 그런듯 합니다. 호환성뷰모드로 가서 펼치면 접혀진 사이드바를 다시 펼칠수 있긴 합니다. 이 기능은 익스플로러6이하는 지원하지 않습니다.

미투데이 포스팅 지원

• 지원 브라우저 : (ie6, ie7, ie8, firefox, safari, opera, chrome)

미투데이에서 블로그로 보내온 글에 포함된 하이퍼링크의 대상을 동적으로 생성된 IFRAME에 담아서 띄우는 기능이 있습니다.

익스플로러6이상 지원합니다.

테이블 정렬

• 지원 브라우저 : (ie6, ie7, ie8, firefox, safari, opera, chrome)

스프링노트에서 만들어진 테이블 (class 값이 "datatable"인 colspan, rowspan 이 없는 table)을 TD의 값에따라 오름차순 혹은 내림차순으로 정렬하는 기능이 있습니다. 익스플로러6이상 지원합니다. (관련글 : 자바스크립트 테이블 정렬)

다운로드

• 택스트큐브용 : kongbaguniSkin9.zip

이 글은 스프링노트에서 작성되었습니다.

자바스크립트로 간단한 슈팅게임을 만들수 있지 않을까? 하는 생각이 문득 들었습니다.
가능하더군요. ㅎㅎ

첨부파일을 다운받아 압축을 푸신후 index.html파일을 웹브라우저에서 여시면 됩니다.
이 스크립트는 파이어폭스, 사파리, 오페라에서 잘 작동하지만. 익스플로러에서는 작동하지 않습니다.

ver 0.01 : 2008년 1월 27일

주요 업데이트 내용

1. 주인공의 4방향 움직임 구현
2. 주인공이 칸 밖으로 나갈수 없도록 함
3. 방향에 따라 주인공의 그림이 바뀌도록 함

ver 0.02 : 2008년 1월 28일

주요 업데이트 내용

1. 부드럽게 움직이는 주인공.
2. 주인공 크기를 64*32 에서 64*64의 애니메이션 GIF로 변경. 방향에따라 그림이 바뀌는 효과는 보류.
3. 주인공의 움직임에 따라 배경도 따라 움직이는 기능 추가.
4. 배경그림 변경

ver 0.03 : 2008년 1월 29일

주요 업데이트 내용

1. 주인공의 움직임에. 약간의 버그 수정.
2. 배경이 좌우 상하 4방향으로 움직임.
3. 주인공이 움직이는동안 입력불가모드 적용. 멈추고나서 입력가능해짐.

ver 0.04 : 2008년 1월 30일

주요 업데이트 내용

1. 주인공 그림을 24비트PNG포멧으로 변경.
2. 배경이 입체적으로 움직임.(3중레이어)
3. 배경음악. 효과음 버튼적용.

ver 0.05 : 2008년 1월 30일

주요 업데이트 내용

1. 배경그림을 3중에서 5중으로 업그레이드.

ver 0.06 : 2008년 1월 31일

주요 업데이트 내용

1. 배경음악 . 효과음버튼 제거 (딜레이 문제해결때까지 보류)
2. 알고리즘 제편성. 환경변수 정리작업.
   
3. 8방향 움직임의 구현.

ver 0.07 : 2008년 2월 3일

주요 업데이트 내용

1. 알고리즘 제편성. 환경변수 정리작업.
   
2. 쏟아지는 적군 구현.
3. 간단한 상태창 구현.
4. 진행방향마다 다른 동작의 애니메이션 구현.
   

ver 0.1 : 2008년 2월 4일

주요 업데이트 내용

1. 미사일 그래픽 업그레이드.
2. 난이도 설정 구현.
   
3. 미사일과 충돌 이벤트 구현.
4. 게임오버 이벤트 구현.
5. 잠깐멈춤 기능 구현.

ver 0.11 : 2008년 2월 8일

주요 업데이트 내용

1. 움직임에따라 배경그림위 위치가 틀어지는 버그 해결.
2. 잠깐멈춤시 화면디자인.
3. 마우스좌표를 인식하여 움직이는 UI도입.