티스토리 스크롤바에 따라다니는 이미지

티스토리 블로그를 방문하시다보면 스크롤바에 고정되어 따라다니는 이미지를 보신적이 있으실겁니다. 간단하게 설정하는 법을 알려드리겠습니다.

 

이미지 업로드

 

간단하게 배경이 투명인 png 이미지 파일을 구글에서 검색하시어 받으신 후에, 티스토리 블로그-관리자 모드-스킨편집-파일업로드에서 파일을 업로드 한 후 완료를 누르시면 됩니다.

 

Step1

추가

 

Step2

파일 선택

 

Step3

적용하기

 

Step4

파일을 업로드 하셨다면 해당 파일-마우스 오른클릭-링크주소 복사를 하여 메모장에 별도로 저장해 둡니다.

 

HTML편집

 

이미지를 업로드하셨다면 소스를 입력하기 위해서 티스토리 블로그-관리자모드-스킨 편집-HTML 편집-HTML 탭에서 Ctrl+F로 </body>를 검색하시면 아래와 같이 나옵니다. 

 

Step1

 

Step2

</body> 위의 빈공간에 아래의 첨부된 소스를 입력하시면 됩니다.

 

<img src="./images/" style="width:360px;display:scroll;position:fixed;bottom:25px;right:5.5px;z-index:-500;background-color: rgba(0, 0, 0, 0.0001);" />

스크롤바배경.txt

0.00MB

 

Step3

"  .images/  "에서 / 뒤에 본인이 받으신 png파일명을 입력해야합니다. 예) .images/000.png

bottom: 화면 하단에서 어느 높이에 위치 시킬건지 지정

right: 화면 우측에서 왼쪽으로 얼마나 띄울 것인지 지정

 

테스트 화면