본문 바로가기

블로그 TIP

티스토리 Square스킨 스크롤(휠) 속도 설정

336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

Square스킨

개인적으로 티스토리에서 가독성, 디자인 등 밸런스가 가장 좋은 스킨 < Square >과 < Whatever >이라 생각합니다. 

< Square > 스킨 같은 경우는 '정보형 블로그'에 걸맞고, 많은 분류가 있을 때 정말 좋더군요.

< Whatever > 스킨 같은 경우는 자신만의 대문과 포스팅 가독성이 높지 않나 생각 듭니다.

그리고 스킨 저마다 장점이 있으면, 단점도 존재하는데요. Square 스킨에도 다양한 단점이 있으며, 그중에 가장 큰 불편을 끼치고 있는 부분이 바로 '메뉴 스크롤 속도'가 매우 느리다는 점입니다. 속도가 느리니 뭔가 렉 걸리듯 신경도 쓰일뿐더러, 무거운 느낌도 들어서 거부감이 크게 드는 현상까지 나타나는 거 같더군요. 때문에 Square 스킨을 사용하시는 분들이라면, 필히 < 스크롤(휠) > 속도 조절을 하시길 바랍니다. 

  • Square 스킨의 메뉴 스크롤이 많이 느립니다. 더 나아가 무겁기까지 느껴집니다.
  • 스킨 사용자는 HTML을 통해서 속도 설정을 하셔야 합니다.


스크롤 속도 기본과 조절 후 비교 영상


티스토리 스킨 편집

  • [ 관리자 - 꾸미기 - 스킨편집 - HTML편집 ]에서 편집합니다.



스크롤 변경 방법

  • [ 관리자 - 꾸미기 - 스킨편집 - HTML편집 ]에서 편집합니다.
  • HTML 편집에서 하단으로 내려가면 < scrollInertia > 명령어가 없음을 알 수 있습니다.
  • < scrollInertia:0 >을 추가하면, 스크롤 속도가 0이 되어 빨라집니다.
  • 숫자가 높아질수록 느려지며, 저는 < 150 >을 사용하고 있습니다.

<script>

$(document).ready(function () {

if ($('body').width() > "960") {

$("#sidebar").mCustomScrollbar({

theme: "dark-thin",

autoHideScrollbar: "true",

scrollInertia:150

});

};

});

</script>

위 문구 복사해서 [ Ctrl+F ]으로 찾기로 찾으세요.

그리고 "true" 뒤에 < ,(콤마) >를 붙이고 < scrollInertia:숫자 >를 입력하시길 바랍니다.