[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 말풍선(오른쪽)말풍선(위)말풍선(아래)말풍선(왼쪽) .balloon { position: relative; display: inline-block; } .balloon span { display: inline-block; padding: 10px; color: #fff; background: #ad1e51; border-radius: 20px; } .ba..

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 .arrow { display: inline-block; background: #ad1e51; position: relative; margin-right: 30px; } .arrow.top, .arrow.bottom { width: 10px; height: 20px; } .arrow.left, .arrow.right { width: 20px; height..

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 .triangle { display: inline-block; width: 0; height: 0; border: 30px solid; } .triangle.top { border-color: transparent transparent #ad1e51 transparent; } .triangle.bottom { border-color: #ad1e51 transparent transparent transparent; } .triangle.left { border-color: transparent #ad1e51 tra..

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 보이기 숨기기 $("input:radio[name='radio_obj']").click(function () { var obj_value = $(this).val(); !obj_value ? $("input[name='target_obj']").hide() : $("input[name='target_obj']").show(); }) 구현 예시

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 9 10 11 12 13 보이기 숨기기 function test(event) { var target_obj = document.getElementsByName("target_obj")[0]; !event.target.value ? target_obj.style.display = "none" : target_obj.style.display = "block"; } 구현 예시

[즐거'웅'코드] 목차 jQuery 예제 소스 구현 예시 jQuery 1 2 3 4 5 setInterval(function () { $("(대상)").toggle(); }, 200); 예제 소스 1 2 3 4 5 6 7 8 9 깜빡깜빡 setInterval(function () { $("#test_obj").toggle(); }, 200); 구현 예시

[즐거'웅'코드] 목차 JAVASCRIPT 예제 소스 구현 예시 JAVASCRIPT 1 2 3 4 5 6 7 function test() { document.all.test_obj.style.display = document.all.test_obj.style.display == "" ? "none" : ""; } setInterval(test, 300); 예제 소스 1 2 3 4 5 6 7 8 9 깜빡깜빡 function test() { document.all.test_obj.style.display = document.all.test_obj.style.display == "" ? "none" : ""; } setInterval(test, 300); 구현 예시

[즐거'웅'코드] 목차 jQuery 예제 소스 구현 예시 jQuery 1 2 3 $("(대상)").attr("src","(변경할 이미지 경로)"); 예제 소스 1 2 3 4 5 6 7 8 9 10 img src 변경하기 function test() { $("#test_obj").attr("src","https://tistory1.daumcdn.net/tistory/3031640/skin/images/keypoint_pup.svg"); } 구현 예시

[즐거'웅'코드] 목차 jQuery 예제 소스 구현 예시 jQuery 1 2 3 $("(대상)").attr("src"); 예제 소스 1 2 3 4 5 6 7 8 9 10 11 img src 가져오기 function test() { var tmp = $("#test_obj").attr("src"); alert(tmp); } 구현 예시

[즐거'웅'코드] 목차 JAVASCRIPT 예제 소스 구현 예시 JAVASCRIPT 1 2 3 document.getElementById("(아이디명)").src = "(변경할 이미지 경로)"; 예제 소스 1 2 3 4 5 6 7 8 img src 변경하기 function test() { document.getElementById("test_obj").src = "https://tistory1.daumcdn.net/tistory/3031640/skin/images/keypoint_pup.svg"; } 구현 예시

[즐거'웅'코드] 목차 JAVASCRIPT 예제 소스 구현 예시 JAVASCRIPT 1 2 3 document.getElementById("(아이디명)").src; 예제 소스 1 2 3 4 5 6 7 8 9 img src 가져오기 function test() { var tmp = document.getElementById("test_obj").src; alert(tmp); } 구현 예시

[즐거'웅'코드] 목차 CSS 예제 소스 CSS 1 2 3 4 5 6 input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; } 예제 소스 1 2 3 4 5 6 7 8 input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; }

[즐거'웅'코드] 목차 JAVASCRIPT 예제 소스 구현 예시 JAVASCRIPT 1 2 3 4 var test = prompt("(질문 내용)"); // 해당 질문에 대한 답변이 변수명(test)으로 담긴다. 예제 소스 1 2 3 4 5 6 7 8 9 입력창(prompt) 발생 function test() { var test = prompt("(질문 내용)"); alert("답변 내용 : " + test); } 구현 예시

[즐거'웅'코드] 목차 JAVASCRIPT 예제 소스 구현 예시 JAVASCRIPT 1 2 3 4 5 6 7 if (!confirm("확인(예) 또는 취소(아니오)를 선택해주세요.")) { // 취소(아니오) 버튼 클릭 시 이벤트 } else { // 확인(예) 버튼 클릭 시 이벤트 } 예제 소스 1 2 3 4 5 6 7 8 9 10 11 선택창(confirm) 발생 function test() { if (!confirm("확인(예) 또는 취소(아니오)를 선택해주세요.")) { alert("취소(아니오)를 누르셨습니다."); } else { alert("확인(예)을 누르셨습니다."); } } 구현 예시

[즐거'웅'코드] 목차 JAVASCRIPT 예제 소스 구현 예시 JAVASCRIPT 1 2 3 alert("경고창이 발생하였습니다."); 예제 소스 1 2 3 4 5 6 7 경고창(alert) 발생 function test() { alert("경고창이 발생하였습니다."); } 구현 예시