SweetAlert2 confirm 사용법｜확인/취소 처리와 콜백 활용 예제
기본 confirm()보다 더 세련된 확인창을 만들고 싶다면 SweetAlert2를 추천합니다. 이 글에서는 확인/취소 버튼을 활용한 조건 분기와 콜백 처리 방법을 예제로 […]
IT & WEB
최신 기술 동향, IT 장비 리뷰, 개발자 팁과 같은 다양한 정보를 제공하여 사용자들이 최신 IT 기술을 이해하고 활용할 수 있도록 돕습니다. 이 메뉴는 웹 개발자와 IT 기기에 관심 있는 사람들에게 유익한 정보와 통찰력을 제공합니다.
반응형 모달창 만들기｜전체화면 팝업 UI 완성 가이드
반응형 모달창은 일반적인 브라우저 새창과는 다르게 조금 더 사용자 편의성이 좋으며, 하나의 웹페이지에서 기능을 수행하고, 여러 가지 이벤트와 각종 뷰에
JavaScript alert 확인 후 콜백처럼 이벤트 처리하는 방법
alert 콜백은 지원하지 않습니다. 그런데, 많은 분이 alert() 이후 특정 동작을 실행하고 싶어 합니다. 하지만 alert()는 콜백을 지원하지 않기 때문에,
👁️눈 아이콘으로 로그인 비밀번호 확인하는 방법
로그인 비밀번호 확인하는 방법에 대해서 알아보겠습니다. 로그인 또는 입력 폼(input)의 비밀번호(password)의 경우 별표 처리가 되어있어 있습니다. toggle 버튼으로 비밀번호를 바로
IT & WEB
CSS 버튼 애니메이션 효과 만들기 예제 translateY, box-shadow
CSS 버튼 애니메이션 효과 예제입니다. transform, box-shadow, transition을 활용해 마우스 호버 시 부드럽게 떠오르는 효과를 줄 수 있습니다. 특히 아이콘
IT & WEB
유튜브 Shorts 자동 플레이 슬라이드(Swiper) 적용 방법
유튜브 Shorts 자동 플레이는 여러 개의 영상을 슬라이드가 활성화 될때마다 해당 영상을 자동 플레이하고, 비활성화 되면 영상이 멈추게 하는 방법에
IT & WEB
스크롤 텍스트 나타나는 효과 구현 방법
스크롤 하면서 자연스럽게 텍스트가 서서히 나타나는 웹 효과를 구현해 보세요. Intersection Observer와 CSS 애니메이션을 조합해 부드럽고 세련된 사용자 경험을 제공합니다.
SweetAlert2 확인창 후 콜백 함수 실행하는 방법 (이벤트 처리 예제 포함)
SweetAlert2 알림창 이후 실행하는 콜백 이벤트에 대해서 자세한 설명과 예제 코드와 실행 여부를 확인해 보겠습니다. 기존 alert()보다 예쁜 알림창이고, 콜백
IT & WEB
홈페이지 파비콘 추가 방법 간편 꿀 팁
홈페이지 파비콘(favicon)은 사용자가 홈페이지는 기억하기에 좋은 도구로 사용되는 것 같습니다. 아이콘 형태의 이미지로 브라우저에서 즐겨찾기 또는 브라우저 탭의 홈페이지명 왼쪽에
IT & WEB
크롬 구글 계정 삭제하는 방법 및 추가 팁
크롬 브라우저에서 로그인된 구글 계정을 삭제하는 방법에 대해서 알아보겠습니다. 메인으로 사용하는 PC의 경우 항상 크롬 브라우저에 구글 계정으로 로그인된 상태로
IT & WEB
반응형 글자 크기 설정, clamp 하나로 끝! | CSS 실전 팁
✅ 왜 ‘반응형 글자 크기 설정’이 중요한가? 요즘 웹사이트는 데스크탑, 태블릿, 모바일 등 다양한 해상도에서 접근됩니다.그럴수록 글자 크기의 자동 조절은
SWAL 사용법! SweetAlert2 예쁜 팝업 정복하기
지난 시간에는 SweetAlert2의 기본 설정하는 방법과 공식 사이트에서 제공하는 간단한 소스와 버튼을 통해 예시를 알려드렸습니다. 이번 시간에는 약간의 커스텀을 해서
IT & WEB
반응형 폰트 크기 설정, clamp() 한 줄이면 끝!
웹페이지 개발 시 반응형은 어느덧 필수가 되었습니다. 디스플레이 별로 웹페이지를 만들지 않고, 하나의 페이지로 다 사용이 가능하게 한 건 CSS의
워드프레스에서 수동 애드센스 광고 쉽게 넣는 법
수익형 블로그에서 포스팅 속도가 중요한가? 구글 애드센스 광고 단위 코드를 자동으로 할지? 수동으로 할지? 수동이면 매번 코드를 복사해서 붙여넣기를 해야
IT & WEB
워드프레스 아스트라 테마 상·하단 애드센스 광고 넣는 법
수익형 블로그를 하다 보면, 구글 애드센스 광고를 어떻게 하면 좋을지 고민이 되는 시점이 있다. 처음 자동광고 설정했더니 광고가 너무 많이
IT & WEB
CSS로 고정 비율 박스 만들기 (유튜브 16:9 비율 등 적용 팁)
이미자 또는 콘텐츠 박스 비율을 다양하게 적용하고, 반응형까지 커버해야 할 때 사용하면 좋은 CSS를 알아볼게요. aspect-ratio는 비율을 지정하는 방법을 간단히
IT & WEB
🚩예쁜 alert 모달창 사용법 SweetAlert2
자바스크립트에서 기보 사용하는 alert()를 예쁜 alert()로 꾸며주는 SweetAlert를 사용하는 방법과 몇 가지 예시를 알아보겠습니다. 간단하게 설치할 수 있고, 사용법도 간편하고,
IT & WEB
JavaScript 클립보드 복사 예제
클립보드 복사란?웹페이지에서 특정 영역의 텍스트 내용을 Ctrl+C를 해주는 기능을, JavaScript를 이용해서 구현된 기능입니다. 가장 대표적인 예로 네이버 지도에서 맛집을 검색