본문 바로가기
javaScript/jQuery

랜덤하게 폰트 color, fontsize 변경하기

by mooyou 2023. 2. 17.
728x90
300x250
SMALL

 

버튼을 클릭하면 랜덤하게 폰트 color, fontsize 변경하기

<script>
    var $text=null;

    jQuery(document).ready(function() {
        init();
        initEvent();
    });

    function init(){
        $text=$(".text");
    }

    function initEvent(){
        $("#btnColor").click(function(){
            changeColor();
        })
        $("#btnSize").click(function(){
            changeSize();
        })
    }

    function changeColor(){
        var color = "#" +(parseInt(Math.random()*0xffffff)).toString(16);
        $text.css("color",color);
    }
    function changeSize(){
        var fontSize =(10+parseInt(Math.random()*40))+"px";
        $text.css("fontSize",fontSize);
    }

</script>


<button id="btnColor">색상변경</button>
<button id="btnSize">크기변경</button>
<div class="text">글자 스타일 변경</div>

 

728x90
반응형
LIST

댓글