형변환, setInterval 예제 (랜덤으로 색깔 바꾸기)

랜덤한 색상

이번 예제는 jquery로 글자뒤의 배경색을 랜덤으로 바뀌게 하는 예제입니다. 예제의 조건은 다음과 같습니다.

1. 버튼을 누르면 글자색이 흰색으로 변하고 배경색이 랜덤하게 바뀐다
2. 글자를 누르면 흰 바탕에 검은 글씨로 바뀐다.

형변환, setInterval을 알아야 합니다.

아래는 예제를 완성시킨 모습입니다.

정승호정승호

코드 해설

        <SCRIPT src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js" type="text/javascript"></SCRIPT>

       <div>

        <input type="button" id="colorChange" value="배경색을 바꾸려면 체크">

        <p id="t">정승호정승호</p>

       </div>

        <script>

        var num16;

        $('#colorChange').click(function(event) {

          num16 = Math.random()*0xffffff;

          num16 = parseInt(num16);

          num16 = num16.toString(16);

          $('#t').css('background-color', '#'+num16).css('color', 'white');

        });;

        $('#t').click(function(event) {

          $('#t').css('background-color', '').css('color', 'black');

        });

        </script>