CSS
ajax - 통신 중 로딩 이미지 출력
코드 js function lodingSign() { // 로딩 이미지 div var loading_div = ` `; $('body').append(loading_div); // 마우스 커서 로딩 중으로 변경 $('html').css("cursor", "wait"); // ajax 함수 실행 버튼 클릭 이벤트 차단 $('button').attr('onclick', 'return false;'); } function lodingImgHide() { // 마우스 커서 기본값으로 변경 $('html').css("cursor", "auto"); // ajax 함수 실행 버튼 클릭 이벤트 차단 해제 $('button').attr('onclick', '함수이름()'); // 로딩 이미지 삭제 $('#loading..
COM-DEV 기술설명서
COM-DEV 기술설명서 ✔️ 개요 💬 개발자들의 코드 공유, 질문 등을 위한 커뮤니티 사이트 구현 ✔️ Github 리포지터리 😈 https://github.com/kimchaemin000617/comdev ✔️ 사용된기술 ⚓️ 버전관리 - Git , Github ⚓️ 배포 - 👾 Github - ☕️ Tomcat - 🐳 Docker ♻️ 개발환경 - SpringBoot - Sqlyog - Chrome - Firefox - Windows 11 - Tomcat - JSP 🔥 서비스환경 - Nginx - Mariadb - Docker 🔱 기술 스택 - Java - Spring Boot - MariaDB - HTML, CSS, JS - JQuery - Ajax - Tailwindcss - daisy ui ✔..
HTML, CSS - select의 option 클릭 시 링크 이동
코드 게시판 공지 게시판 자유 게시판 사용 시 참고 https://goodsgoods.tistory.com/249
HTML, CSS - input type
표 유형 설명 기본 예제 Spec text (en-US) 디폴트 값. 한줄의 텍스트 필드입니다. 새줄 문자는 입력값으로부터 자동으로 제거됩니다. password (en-US) 값이 가려진 한줄 텍스트 필드. 사이트가 안전하지 않으면 사용자에게 경고합니다. email (en-US) 이메일 주소를 편집할 수 있는 필드. 텍스트 입력 필드처럼 보이지만 유효성 검증 매개변수가 존재하며, 브라우저와 장치가 동적 키보드를 지원하는 경우 이메일에 적합한 키보드를 보여줍니다. HTML5 button 기본 행동을 가지지 않으며 value을 레이블로 사용하는 푸시 버튼. file 파일을 지정할 수 있는 컨트롤. accept 특성을 사용하면 허용하는 파일 유형을 지정할 수 있습니다. hidden (en-US) 보이지 않지만..
HTML, CSS - Toast Ui에 폰트 적용
코드 html > body, html > body .toastui-editor-contents, html > body .ProseMirror, html > body .toastui-editor-md-code, html > body .toastui-editor-md-code-block { font-family: "my-font", sans-serif; text-underline-position: under; } 사용 font-family: "my-font" 자리에 font-family 명을 쓰면 된다. 출처 유튜브 몰입코딩 아카이브
HTML, CSS - Daisy Ui를 이용한 다크 / 라이트 모드 구현
코드 (JQuery, Tailwindcss) 테마 변경 설명 jquery의 attr을 사용해서 html에 할당된 data-theme값을 변경해주고, 새로고침이 되어도 유지가 되도록 localStorage의 get,set item을 사용하여 저장 / 불러오기를 했다. 참고 https://velog.io/@yijaee/%EB%8B%A4%ED%81%AC%EB%AA%A8%EB%93%9C-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0 출처 직접 만들었습니다!
HTML, CSS - 강제 줄바꿈
자동으로 줄바꿈이 되지 않는 특수문자 / 띄어쓰기 없는 영단어 강제 줄바꿈 하는 방법word-break: break-all;실제 코드(tailwind) ${reply.body}