./modules/board/skins/스킨명/script.js
function setFontSize(font_size){ if (font_size === 'lg' || font_size === 'sm') { $('html').removeClass().addClass(font_size); } else { $('html').removeClass(); } var ExpDate = new Date(); ExpDate.setTime(ExpDate.getTime() + 1000*60*60*24*365); setCookie('view_size', font_size, ExpDate,'/'); }
먼저 스킨에서 활용할 폰트사이트조정함수를 만듭니다.
./modules/board/skins/스킨명/list.html
<div onclick="setFontSize('sm');">작게</div> <div onclick="setFontSize('md');">기본</div> <div onclick="setFontSize('lg');">크게</div>
스킨에서는 위와 같이 함수를 불러오는 식으로 활용 가능합니다. 파일 위치는 script.js를 불러오는 어디에서나 사용 가능합니다.
./modules/board/skins/스킨명/style.css
html { font-size:10px;font-size: 62.5%; } /* =10px */ html.lg{font-size: 71.5%;} html.sm{font-size: 53.6%;}
스크립트에서 정의해준 대로, html의 class를 조정하는 식으로 하기 때문에 CSS에서 기본 폰트 사이즈를 조정해줍니다.
./modules/board/skins/스킨명/list.html
<?php if ($_COOKIE['view_size']) { echo "<script>$('html').addClass('".$_COOKIE['view_size']."');</script>"; } ?>
그리고 getCookie함수를 사용해도 될거 같긴 한데, php로 하는게 좀더 빠른 화면 전환이 이뤄질 거 같아 php로 쿠키를 가져와서 실행시켜줍니다.
위 코드는 게시판 헤더 파일을 별도로 만들어서 넣어둡시다. 아니면 리스트, 글삭제, 글쓰기 등 모든 화면에 동일한 코드를 추가해넣어놓으셔야 합니다.