페이지 위로가기 버튼을 만들어 보자.
- body 사이에 버튼을 넣어준다.
버튼을 만드는 방법은 아주 다양합니다. 예문처럼 만들수도 있고 div, span, img로도 할 수 있어요.
저는 그냥 배운대로 button 태그로 만들었습니다. id도 본인이 기억하기 쉽게 알아서.
"▲" 버튼모양을 이렇게 화살표를 넣어도 되고 글자를 넣어도 됩니다. <img>로 이미지를 넣어도 됩니다.
- head 사이에 스크립트를 넣는다.
스트립트 태그중 숫자 200은 언제 버튼이 나타날지 지정해주는거에요. 스크롤이 200이 되면 버튼이 나타납니다.
자신의 블로그 스타일에 맞게 숫자를 입력하세요.
css 편집도 해줍니다. 버튼의 크기. 위치, 색을 만들어줍니다.
다른 블로그에 적용한 모습니다. 투명도를 줘서 평소에는 버튼 뒤 본문이 살짝 보이게 해줬습니다.
마우스가 버튼에 올라가면 진하게 색이 변합니다.
위로가기 버튼.txt위 태그입니다. 다운받아 본인 마음에 들게 편집해서 사용하세요.