플로팅 메뉴 따라하기
- 티스토리스킨수정/스킨수정팁
- 2011. 2. 27. 06:00
플로팅 메뉴를 혹시나 저처럼 똑같이 사용하기를 원하시는 분이 있을수도 있다고 생각해서 이 글을 작성합니다.
전편에 소개한 floating menu 에서 다소 부족한 부분이 있어 보충합니다.
이전글을 보지 않으신분은 다소 이해를 못할수도 있으니 이전글을 참고해주세요.
이번글을 저와 똑같이 home, top(위로이동), comment(댓글로이동), bottom(맨아래로 이동), 방명록, RSS(피드구독) 등을 이용하는 방법입니다.
사용법은 이전글과 똑같습니다. 약간의 수정만 하면 됩니다.
우선 아래의 이미지를 업로드하세요.
올려드린 이미지는 배경없는 png 파일입니다.
그다음 css 설정을 합니다.
위에 올려드린 이미지는 40*40px 의 이미지를 하나로 합친겁니다.
왜 이미지를 합쳤는지 모르시는 분은 아래 링크를 참고하세요.
다음은 a 링크 부분에 대한 css 설정입니다.
이것으로 css 스타일 설정은 끝났습니다.
다음 위, 아래로 이동하는 방법을 알려드리겠습니다.
약간의 html 만 수정하시면 됩니다.
그 아래에 넣으시면 됩니다.
<a name ..... 라고 알려드린것은 하나의 책갈피 정도라고 생각하시면 됩니다.
화면에는 표시되지 않고 닻이라고 생각하면 됩니다.
적당한 곳에 삽입해 주시고 안될경우 문의 주세요.
이것으로 모든 것은 설정이 끝났습니다.
<a name... 의 경우 삽입을 잘못하면 익스플로러에서는 작동이 안된는 경우가 있으니 참고하시기 바랍니다.
전편에 소개한 floating menu 에서 다소 부족한 부분이 있어 보충합니다.
이전글을 보지 않으신분은 다소 이해를 못할수도 있으니 이전글을 참고해주세요.
이번글을 저와 똑같이 home, top(위로이동), comment(댓글로이동), bottom(맨아래로 이동), 방명록, RSS(피드구독) 등을 이용하는 방법입니다.
사용법은 이전글과 똑같습니다. 약간의 수정만 하면 됩니다.
우선 아래의 이미지를 업로드하세요.
올려드린 이미지는 배경없는 png 파일입니다.
floating menu 설정
다음 html 코드를 아래처럼 변경해주세요.
그다음 css 설정을 합니다.
위에 올려드린 이미지는 40*40px 의 이미지를 하나로 합친겁니다.
왜 이미지를 합쳤는지 모르시는 분은 아래 링크를 참고하세요.
참고
다음은 a 링크 부분에 대한 css 설정입니다.
이것으로 css 스타일 설정은 끝났습니다.
다음 위, 아래로 이동하는 방법을 알려드리겠습니다.
약간의 html 만 수정하시면 됩니다.
top, bottom, comment 이동버튼 만드는 방법
맨아래로 이동
대부분의 스킨이 footer 을 이용할겁니다.그 아래에 넣으시면 됩니다.
<a name ..... 라고 알려드린것은 하나의 책갈피 정도라고 생각하시면 됩니다.
화면에는 표시되지 않고 닻이라고 생각하면 됩니다.
적당한 곳에 삽입해 주시고 안될경우 문의 주세요.
이것으로 모든 것은 설정이 끝났습니다.
<a name... 의 경우 삽입을 잘못하면 익스플로러에서는 작동이 안된는 경우가 있으니 참고하시기 바랍니다.