| <!DOCTYPE HTML> | |
| <html> | |
| <head> | |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> | |
| <title>Untitled Document</title> | |
| <style> | |
| body { | |
| font-size: 9pt; | |
| } | |
| #panel1 { | |
| border: 1px #000000 solid; | |
| line-height: 400px; | |
| font-size: 100px; | |
| width: 400px; | |
| height: 400px; | |
| text-align: center; | |
| vertical-align: middle; | |
| } | |
| </style> | |
| <script src="http://code.jquery.com/jquery-1.10.1.min.js"> | |
| </script> | |
| <script type="text/javascript"> | |
| $(document).ready(function() { | |
| var stopinter; | |
| $('#btn_Start').click(function() { | |
| clearInterval(stopinter); | |
| start(); | |
| }); | |
| function start() { | |
| stopinter = setInterval(moveStart, 100); | |
| } | |
| function moveStart() { | |
| var btn = $('#lab_total').val(); | |
| var num = parseInt(Math.random() * btn + 1); | |
| $('#panel1').html(num); | |
| $('#panel1').css('color','#' + (parseInt(Math.random()*0xffffff)).toString(16)); | |
| $('#panel1').css('font-size', parseInt(Math.random() * 300 + 1) + 'px'); | |
| } | |
| $('#btn_Stop').click(function() { | |
| clearInterval(stopinter); | |
| }); | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <div> | |
| <h4>경품추첨기-ver 0.1</h4> | |
| <div id="panel1"></div> | |
| <div id="nav"> | |
| 참여인원 : <input type="text" id="lab_total" value="100"></input> | |
| <button id="btn_Start">시작</button> | |
| <button id="btn_Stop">멈춤</button> | |
| </div> | |
| </div> | |
| </body> | |
| </html> | |
'2020년도 이전 > [WebSig] JQuery' 카테고리의 다른 글
| #img1을 #bar의 영역에서 계속 좌우로 움직이도록 만들어주세요. (0) | 2013.07.29 |
|---|---|
| #image_view안에는 9개의 이미지가 있습니다. 이미지가 보일 수 있도록 계속해서 상하로 스크롤 해주세요. (0) | 2013.07.29 |
| JQuery를 이용한 슬라이드 토글 가로 메뉴 (0) | 2013.07.29 |
| JQuery를 이용한 슬라이드 토글 세로 메뉴 (0) | 2013.07.29 |
| JQuery를 이용한 갤러리.... (0) | 2013.07.29 |