[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 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 #test_obj { position: absolute; width: 70px; height: 350px; right: 50px; border-radius: 70px; top: 250px; border: 1px solid #dddddd; } $(document).ready(function () { var tmp = parseInt($("#test_obj").css('top')); $(window).scroll(function () { var scrollTop = $(window).scroll..

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 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 input[type="checkbox"] { -webkit-appearance: none; position: relative; width: 16px; height: 16px; cursor: pointer; outline: none !important; border: 1px solid #eeeeee; border-radius: 2px; background: #fbfbfb; } input[type="checkbox"]::before { content: "\2..

[즐거'웅'코드] 목차 CSS CSS 1 2 3 4 5 ol { list-style: none; }

[즐거'웅'코드] 목차 CSS CSS 1 2 3 4 5 ul { list-style: none; }

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 $(window).resize(function () { var tmp = window.innerHeight; alert(tmp); }).resize(); 구현 예시

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 $(window).resize(function () { var tmp = window.innerWidth; alert(tmp); }).resize(); 구현 예시

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 div { margin-bottom: 500px; } 'test_obj_1'으로 이동'test_obj_2'으로 이동'test_obj_3'으로 이동 test_obj_1test_obj_2test_obj_3 function test(seq){ var offset = $("#test_obj_" + seq).offset(); $('html, body').animate({scrollTop : offset.top}, 400); } 구현 예시

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 형광펜 밑줄 효과 .test_obj { border-bottom: 3px solid #d6f2b6; box-shadow: inset 0 -4px 0 #d6f2b6; } 구현 예시

[즐거'웅'코드] 목차 CSS CSS 1 2 3 4 5 ::-webkit-scrollbar { display: none !important; }

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 .test_obj { background: url('/images/bg.jpg') no-repeat center center/cover, rgba(0, 0, 0, 0.5); background-blend-mode: multiply; } 구현 예시

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 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 60 61 62 63 64 65 66 67 68 69 70 .accordion { background-color: #ffffff; cursor: pointer; padding: 16px; width: 100%; outline: none; border: none; text-align: left; font-size: 16px; transition: 0.4s;..

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 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 60 61 62 63 64 65 66 67 68 69 70 71 72 73 .test_obj { background-color: rgba(0, 0, 0, .1); color: #fff; font-size: 15px; line-height: 50px; height: 50px; margin-bottom: 10px; border-radius: 25px; } ...

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 1 2 3 4 5 6 7 8 document.getElementById('test_obj').addEventListener('blur', function (e) { var x = e.target.value.replace(/\D/g, '').match(/(\d{3})(\d{4})(\d{4})/); e.target.value = x[1] + '-' + x[2] + '-' + x[3]; }); 구현 예시

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 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 function test(e) { var number = e.value.replace(/[^0-9]/g, ""); var phone = ""; if (number.length

[즐거'웅'코드] 목차 예제 소스 구현 예시 예제 소스 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 function test() { var result = document.getElementById("result"); var email = document.getElementById("email").value; result.innerText = ""; var re = /^(([^()[\]\\.,;:\s@\"]+(\.[^()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,})..