게임, 그 끝없는 이야기의 시작.

게임에 관한 모든 이야기를 담은 블로그입니다. 새로운 게임 정보는 물론, 전략, 팁, 리뷰와 같은 다양한 콘텐츠를 통해 여러분과 함께 게임의 이야기를 나눕니다.

블로그

티스토리 블로그 프로그레스바(Progress Bar) 적용하는 방법

gameabout 2023. 1. 12. 19:49

티스토리 블로그 프로그레스바, 스크롤 진행률 적용시키면 블로그 글을 읽을 때 글 상단에 진행률이 표시 된다. 해당 페이지를 읽어내려가면서 글 상단을 보자.

 

위 글은 오기세이 스킨에 브레드크럼(이동경로)에 대한 글이다. 글을 읽어 내려 갈수록 주소창 아래 프로그레스바(Progress Bar)를 볼 수 있다.

 

프로그레스바를 적용하기 위해서는 먼저 스킨 편집에 있는 html편집에 들어가서 HTML 탭에서 아래 코드를 <body> 태그 안에 넣어주면 된다.

 

<!-- toc script end-->
<!-- start progress bar --> <script type="text/javascript" src="https://rawcdn.githack.com/mburakerman/prognroll/0feda211643153bce2c69de32ea1b39cdc64ffbe/src/prognroll.js"></script> <script type="text/javascript"> $(function() { $("body").prognroll( {color:"#FF9800"} ); $(".content").prognroll({ custom:true}); }); </script> <!-- end progress bar -->

prognroll({color:"#FF9800"}); 태그에서 바의 색을 변경할 수 있다.