폰트사이즈 확장 및 축소

폰트사이즈 확장 및 축소

컨텐츠 본문에서 폰트 사이즈 확장 및 축소 jQuery

var maxNum = 24;            // 폰트 사이즈 
var nimNum = 14;            // 폰트 사이즈 
 
$('.box-zoom .btn-zoomin').on('click', function () {
    // console.log(uiSize + 2)
    var ui_font = $(".box-news-body").css("font-size")
    var uiSize = Number(ui_font.replace(/[^0-9]/g,''));
        if (uiSize < maxNum)
        $('.box-news-body').css({'font-size': '+=2'});
        
});
$('.box-zoom .btn-zoomout').on('click', function () {
    // console.log(uiSize + 2)
    var ui_font = $(".box-news-body").css("font-size")
    var uiSize = Number(ui_font.replace(/[^0-9]/g,''));
        if (uiSize > nimNum)
        $('.box-news-body').css({'font-size': '-=2'});
        
});

<!-- 본문 글자 조절 -->
<div class="box-zoom">
    <span class="btn-zoomin"><button>글자 크게</button></span>
    <span class="btn-zoomout"><button>글자 작게</button></span>
</div>
<!-- //본문 글자 조절 -->
<!-- 본문 -->
<div class="box-news-body">
    <p>
        신고를 받은 경찰은 현장에서 배회 중인 개 2마리를 포획했다.
        달아난 나머지 개 2마리도 1시간 뒤 다시 현장으로 돌아와 붙잡혔다.
        갑작스러운 개들의 공격으로 팔과 다리 등 일곱 군데를 물린 아내 이씨는 
        부상 정도가 심해 광주의 한 종합병원으로 옮겨져 치료를 받고 있다.
    </p>
</div>
<!-- // 본문 -->

컨텐츠 본문에서 텍스트 크기를 제어한다.

기본 폰트 사이즈를 구해와서 기본 폰트값에서 최대 24px, 최소 14px 로 확장 및 축소를 한다.

CSS는 직접 짜서 사용 하시길 바랍니다.