반응형 jquery4 jQuery로 간단한 todo 만들기 제이쿼리로 투두리스트 간단하게 만들어봤습니다. 인풋박스에서 텍스트 작성하고 엔터치면 리스트 추가되도록 했습니다. jQuery Todo List 청소하기 checkdel 장보기 checkdel 공부하기 checkdel 쇼핑하기 checkdel clear * { margin: 0; padding: 0; list-style: none; text-decoration: none; color: #333; text-align: center; box-sizing: border-box; } #main { padding: 30px 20px; margin: 0 auto; width: 500px; background: #ddd; } h1 { padding: 0 0 20px; color: #fff; } ul li { displ.. 2019. 11. 14. CSS3 + jQuery로 버튼효과 HTML5 1 cilck CSS3 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 .more_btn { overflow: hidden; display: block; position: relative; width: 160px; margin-top: 45px; border: 1px solid skyblue; font-size: 13px; font-weight: 700; line-height: 54px; text-align: center; color: #222; -webkit-transition: color .4s; transition: color .4s; font-.. 2019. 9. 25. jQuery 효율적으로 사용하기 한 번 탐색한 DOM을 다시 탐색하게 하지 않기 bad code 1 2 3 4 5 6 7 8 9 10 11 $('button').on('click', function() { // DOM 한번 탐색 $('.modal').modal(); // DOM 다시 한번 탐색 $('.modal').addClass('active'); // DOM 또 다시 한번 탐색 $('modal').css(...); }); good code 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 $('button').on('click', function() { // DOM 한번만 탐색 (체이닝) $('.modal') .modal() .addClass('active') .css(...); }); $('button').. 2019. 9. 25. on이벤트에 파라미터 전달 1 2 click click 1 2 3 4 5 6 7 8 9 10 11 12 13 var btn1 = $('.btn1'); var btn2 = $('.btn2'); var two = 2; var three = 3; btn1.on('click', { number : 1}, test); btn2.on('click', { number : 2}, test); function test( $e ){ alert( $e.data.number ); } on이벤트에 { name: } 이라는 파라미터를 만들고 data.number로 호출하면 버튼을 클릭했을때 각각 1,2가 출력된다. 2019. 9. 25. 이전 1 다음 반응형
