Misun's Archive

 printf 지시자 %b :  불린 boolean %d : 10진수 decimal integer %o : 8진수 octal integer %x , %X : 16진수 hexadecimal integer %f : 10진수 decimal float %e , %E : 지수형태표현 exponent %c : 문자 character %s : 문자열 string 특수문자 \t : tab \b : backspace \f : form feed \n : new line \r : carriage return \\ : 역슬래시 \' : 작은따옴표 \" : 큰따옴표 \u : 유니코드

package test; public class oper { public static void main(String[] args) { // TODO Auto-generated method stub int a; int b; int ti; float c; float d; float fi; a=8; b=7; ti= a+b; System.out.println(ti); ti= a-b; System.out.println(ti); ti= a*b; System.out.println(ti); ti= a/b; System.out.println(ti); c=8.8f; d=2.2f; fi= c+d; System.out.println(fi); fi= c-d; System.out.println(fi); fi= c*d; System.out.println(fi); fi= c/d; System.out.println(fi); int e=1; e++; System.out.println(e); int f=1; f+=1; System.out.println(f); int g=1; g--; System.out.println(g); int h=1; h-=1; System.out.println(h); int i=8; int j=5; int ni; ni= i % j; System.out.println(ni); System.out.printf("%b\n",i>j); System.out.printf("%b\n", i<j); System.out.printf("%b\n", i==j); System.out.printf("%b\n", i!=j); ...

%d: 10진수(정수형) %f: 실수형 %e: 지수형 %o: 8진수 %x: 16진수 %u: 부호없는 10진수 %g: 실수형 자동출력 %p: 포인터의 주소 %c: 하나의 문자로 출력 %s: 문자열

package test; public class hello { public static void main(String[] args) { // TODO Auto-generated method stub int age;//1~100, 1000 int는 상수 age는 변수                  age=8; int nai; nai=age; System.out.println(age); System.out.println(nai); } }

$("#id_of_textbox").keyup(function(event){     if(event.keyCode == 13){         $("#id_of_button").click();     } }); ------------------------------------------------ document.getElementById("id_of_textbox")     .addEventListener("keyup", function(event) {     event.preventDefault();     if (event.keyCode == 13) {         document.getElementById("id_of_button").click();     } });

<div id='main'>   <div class="container">   </div> </div> --------------------------------------- (1) 아이디(id)가 main인 요소 선택 document.getElementById('main'); document.querySelector('#main'); (2) 클래스명이 container인 요소 선택 document.getElementsByClassName(' container '); document.querySelector('. container ');  //같은 이름의 클래스가 다수인 경우 첫번째 container 선택 document.querySelectorAll('. container ');  //같은 이름의 클래스가 다수 인 경우 해당하는 모든요소 선택 (3) div태그 요소 선택 document.getElementsByTagName('div'); document.querySelector('div');   //div  태그가 다수인 경우 첫번째 div 선택 document.querySelectorAll('div');   //div  태그가 다수인 경우 모든 div 선택 Browser compatibility(브라우저 지원) Desktop   Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit) Basic support 1 (Yes) 3.5 8 10 3.2

<style> ul, li {list-style:none; margin:0; padding:0; display:block;} #loadingWrap {position:relative; width:90px; height:90px; /*border:1px solid pink;*/ margin:20% auto;} .circle {width:20px; height:20px; border-radius:50%; background-color:pink;} .c1 {position:absolute; top:0; left:50%; margin-left:-10px;} .c2 {position:absolute; top:25%; right:25%; margin-top:-10px; margin-right:-10px;} .c3 {position:absolute; top:50%; right:0; margin-top:-10px;} .c4 {position:absolute; bottom:25%; right:25%; margin-bottom:-10px; margin-right:-10px;} .c5 {position:absolute; bottom:0; left:50%; margin-left:-10px;} .c6 {position:absolute; bottom:25%; left:25%; margin-bottom:-10px; margin-left:-10px;} .c7 {position:absolute; top:50%; left:0; margin-top:-10px;} .c8 {position:absolute; top:25%; left:25%; margin-top:-10px; margin-left:-10px;} </style> <ul id="loadingWrap"> <li class="circle c1"></li> <li class="circl...

<style> #loadingBar {width:0%; height:10px; background-color:pink; margin:0; padding:0;} </style> <div id="loadingBar"></div> <script>  var bar = document.getElementById("loadingBar");  window.onload= start; var i=0; function loading(){ i+=0.1; bar.style.width= i + "%"; if(i>=100){ clearInterval(timer); } } function start(){ timer= setInterval(loading, 5); } </script> -------------------------------------------------------------------------------------------------- <style> #loadingBar {width:0%; height:10px; background-color:pink; margin:0; padding:0;} </style> <div id="loadingBar"></div> <script>  var bar = document.getElementById("loadingBar");  window.onload= start; var i=0; function loading(){ i+=0.1; j = i * 0.1; bar.style.width= j + "%"; console.log(i); if(i==1000){ clearInterval(timer); } } func...

<strong>3초후에는 네이버 홈페이지로 이동합니다</strong> <br/> <br/> <div id="loadingBar"></div> <style> #loadingBar {width:0px; height:20px; background-color:pink;} </style> <script> var redirecturl="http://naver.com" var pausefor=4 var bar = document.getElementById("loadingBar"); var i=0; function postaction(){ window.location=redirecturl; } setTimeout("postaction()", pausefor*1000) function loading(){ i++; bar.style.width= i + "px"; if(i==1000){ clearInterval(timer2); } } function start(){ timer2= setInterval(loading, 0.1); }  window.onload= start; </script> <style>

<form> You can choose 2 in maximum : <input type=checkbox name=box1 id="box1" onClick="countChoices(this)"><label for=box1>Frozen</label> <input type=checkbox name=box2 id="box2" onClick="countChoices(this)"><label for=box2>Finding Nemo</label> <input type=checkbox name=box3 id="box3" onClick="countChoices(this)"><label for=box3>the Beauty and the Beast </label> </form> <input type="button" value=" Close " onClick="self.close( )"> <script> function countChoices(obj) { var max = 2; // 최대로 선택할 수 있는 박스 수 var box1 = obj.form.box1.checked;  // 사용할 체크박스 var box2 = obj.form.box2.checked; var box3 = obj.form.box3.checked; var count = (box1 ? 1 : 0) + (box2 ? 1 : 0) + (box3 ? 1 : 0); if (count > max) { alert("최대 " + max + " 개 까지만 선택할 수 있습니다"); obj.checked = false;    } } </script> ...

<script>   function selectivecheck(field, myselection){       var fieldid;       var pos;       var criteria;       var strng;       strng = myselection.value;       for (i=0; i<field.length; i++){           if (strng=="all"){             field[i].checked = true;           }else{               fieldid = field[i].id;               pos = strng.substring(0,1);               criteria = strng.substring(1,2);               if (fieldid.substring(pos,pos+1)==criteria){                   field[i].checked = true;                }else{             ...

<script> function checkall(A,B,C){ var X=eval("document.forms."+A+"."+B) for (c=0;c<X.length;c++) X[c].checked=C } </script> <form name="album"> <input type="checkbox" name="v1">Trey Songz<br> <input type="checkbox" name="v1">Adele<br> <input type="checkbox" name="v1">Sam Smith<br> <input type="checkbox" name="v1">Ed Sheeran<br> <input type="checkbox" name="v1">Coldplay<br> </form> <a href="javascript:checkall('album','v1',true)">Select All</a> <a href="javascript:checkall('album','v1',false)">Unselect All</a> ---------------------------------------------------------------------------------- Trey Songz Adele Sam Smith Ed Sheeran Coldplay...

forms 객체는 links, images 등과 같은 배열 형태로 document 객체의 하단에 존재하는 객체이다. forms[ ] 배열 폼의 구성 요소와 마찬가지로 폼 자체도 배열로 참조되어질 수 있다. 배열의 순서는 구성 요소의 순서와 마찬가지로 HTML 내에서 기술된 순서대로 0번부터 참조되어지며, 그 형식은 document.forms[0]과 같은 방식으로 참조된다. 물론 배열로 참조된 폼 내의 구성 요소 참조시에도 elements[] 배열을 사용할 수 있다. 즉, HTML내에서 기술된 두 번째 폼에서 세 번째 구성 요소를 참조하고자 한다면 document.forms[1].elements[2]와 같이 하면 참조가 가능하다. form에서 사용되는 각 양식들의 이름(name )을 정의해 준다면, 이들을 모두 자바스크립트에서 쉽게 접근할 수 있다. 만약, 이름을 정의해 주지 않는다면 아래와 같이 참조할 수 있다. ...... <form> →document.forms[0] <input type=text value='Text1'> →document.forms[0].elements[0] <input type=text value='Text2'> →document.forms[0].elements[1] <input type=submit> </form> <form> →document.forms[1] <input type=text value='Text1'> →document.forms[1].elements[0] <input type=text value='Text2'> →document.forms[1].elements[1] <input type=submit> </form> ...... form 태그에도 아래와 같이 이름을 정의해 줄 수 있다. 이름...

<style> body{font-size:9pt;} #panel{border:1px #000000 solid; line-height:400px; font-size:100px; width:400px; height:400px; text-align:center; vertical-align:middle;} </style> <script> var panel; var nTimerID; var labTotal; var nTotalMember; window.onload=function(){ this.init();// 요소 초기화 실행. this.initEventListener();// 이벤트 초기화 실행. } function init(){// 요소 초기화. this.panel = document.getElementById("panel");// 숫자가 출력될 #panel을 찾아 전역변수에 담아둡니다. this.nTimerID = 0;// 참여인원 정보가 입력된 패널을 찾아 전역변수에 담아둡니다. this.labTotal = document.getElementById("lab_total"); this.nTotalMember = 0; } function initEventListener(){// 이벤트 초기화. var btnStart = document.getElementById("btn_start"); btnStart.addEventListener("click", function(){ startTimer(); },false); var btnStop = document.getElementById("btn_stop"); btnStop.addEventListener("click...

  <style> .container {position: relative;   -webkit-perspective: 1000;   -moz-perspective: 1000;   -ms-perspective: 1000;   -o-perspective: 1000; } .card { width: 200px; height: 200px;margin: 0 auto; position: relative;   -webkit-transform-style: preserve-3d;   -webkit-transition: 0.5s;   -moz-transform-style: preserve-3d;   -moz-transition: 0.5s;   -ms-transform-style: preserve-3d;   -ms-transition: 0.5s;   -o-transform-style: preserve-3d;   -o-transition: 0.5s;   transition: 0.5s; } .face {position: absolute; backface-visibility: hidden; width: 100%; height: 100%; color: white; line-height: 200px; text-align: center;   -webkit-backface-visibility: hidden;   -moz-backface-visibility: hidden;   -ms-backface-visibility: hidden;   -o-backface-visibility: hidden;  } .front {background: skyblue; z-index: 10;} .back {background: pink;   -webkit-transform: rotateY(180deg);   -mo...

<!doctype html> <html lang="en">  <head>   <meta charset="UTF-8">   <title>Document</title>   <style> #card{position:relative; width:200px; height:200px; margin:0 auto; } #front{position:absolute; top:0; left:0; color:white; font-size: 30px; text-align:center; line-height:200px;background-color: skyblue; width:100%;}   </style>  </head>  <body> <div id="card" onclick="flip()">  <div id="front" > Front content  </div> </div> <script>   var k = 0;   function flip() {     var card = document.getElementById("card");     k += 180;     card.style.transform = "rotatey(" + k + "deg)";     card.style.transitionDuration = "0.5s";   } </script>  </body> </html> ------------------------------------------------------------------------------- ...

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">  <title>공 튀기기</title>  <script>  var nX=0;  var nY=0;  var nStepSize=4;  var nStepX=nStepSize;  var nStepY=nStepSize;  var ball;  var nTimerID=0;  var nEndX=0;  var nEndY=0;  window.onload=function(){   init();   initEventListener();  }  function init(){   nTimerID=0;   var panel=document.getElementById("panel");   ball=document.getElementById("ball");   nEndX=panel.offsetWidth-ball.offsetWidth;   nEndY=panel.offsetHeight-ball.offsetHeight;  }  function initEventListener(){   document.getElementById("btn_start").addEventListener("click",function(){start();}, false);   document.getElem...

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"> <title>scroll_menu</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <style> .wrap {width:1000px; height:3000px; background-color:#cdcdcd; margin:0 auto;} #q_menu {width:80px; height:300px; border: 1px solid #000; position: absolute; margin-left: 1000px; margin-top: 150px;} #textDiv {position: absolute;} </style> <script type="text/javascript"> $(document).ready( function(){ $('#q_menu').animate({'top':$(document).scrollTop()+20+'px'},500);//처음시작하는위치 $(window).scroll(function(){ $('#q_menu').stop(); $('#q_menu...

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"> <title>scroll_menu</title> <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script> $(function(){ var menu=$("#top_menu > ul > li"); var contents=$('#contents > div'); //메뉴 클릭시 해당 컨테이너로 이동 menu.click(function(event){ event.preventDefault(); var i=$(this).index(); var tt=contents.eq(i).offset().top; $("html, body").stop().animate({scrollTop:tt}); }); //스크롤시 해당메뉴가 선택됨 $(window).scroll(function(){ var sct=$(window).scrollTop(); console.log(sct); contents.each(function(){ var i=$(this).in...

<!DOCTYPE html> <html lang="ko"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"> <title>JQuery accordion Menu</title> <style> body * {margin:0; padding:0; font-family:Malgun gothic; list-style:none;} .accordion {width:202px; overflow:hidden; border-bottom:1px solid #ccc; padding-left:5px; padding-top:5px } .accordion * {font-size:13px; text-decoration:none;} .accordion li {width:200px; vertical-align:top; border-left:1px solid #ccc; border-right:1px solid #ccc;} .accordion li a {padding:10px; border-top:1px solid #ccc; display:block; background:#fafafa; color:#555;} .accordion li a.more {background:#fafafa url(../images/icon_down.gif) no-repeat 180px center;} .accordion li a.less {background:#fafafa url(../images/icon_u...