본문 바로가기

예제4

[javascript] input 텍스트 초기화 버튼 clear버튼을 누르면 텍스트 상자 내용이 초기화 된다. html Clear js function reset(){ document.querySelectorAll("input[type=text]")[0].value=""; } input type text reset button 2021. 9. 3.
[jQuery] input file 초기화 버튼 생성, 초기화 하기 HTML 초기화 jQuery function btnHidden() { $(".fileResetBtn").attr("style", "display:none"); } $(function() { // 버튼을 숨긴다 btnHidden(); // 파일 업로드가 될 때 버튼을 생성한다. $(".fileInput").on("change", function() { if ($(this).val() != "") { $(this).siblings(".fileResetBtn").attr("style", "display:block"); } else { btnHidden(); } }); // 버튼을 누르면 파일 값을 없앤다 $(".fileResetBtn").click(function() { $(this).siblings(".fi.. 2021. 8. 12.
[javascript/es6] 딤처리 레이어 팝업 예제 자바스크립트 최신문법 딤처리 팝업(모달) 예제 1. HTML 1번 팝업 × 1번 팝업. 2번 팝업 × 2번 팝업. 3번 팝업 × 3번 팝업. 2. CSS .modal { display: none; position: fixed; z-index: 1; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: #000; background-color: rgba(0, 0, 0, .4) } .modal-content { position: relative; background-color: #fefefe; margin: auto; padding: 0; border: 1px solid #888; wid.. 2021. 8. 6.
[jQuery] 딤처리 레이어 팝업 여러개 사용 HTML 첫번째 팝업 열기 두번째 팝업 열기 닫기 첫번째 팝업 두번째 팝업 CSS .popup_bg { position: fixed; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .7); z-index: 500 } .btn_popup { border: none; background: #eee; padding: 10px 30px; border-radius: 30px } .popup { position: fixed; top: 50%; left: 50%; min-width: 200px; min-height: 150px; background-color: #fff; border-radius: 8p.. 2021. 7. 20.