이 기사에서는 JavaScript를 사용하여 짧은 지연 후 모달 창을 표시하는 방법에 대해 설명합니다. 저자는 사용자 경험에 부정적인 영향을 줄 수 있으므로 과용에 대해 경고합니다.
.
예제는 컬러 박스 플러그인 (jQuery 필요)과 를 사용하여 지정된 지연 (밀리 초) 후 모달을 트리거합니다. 이 기사는 접근성을 강조하여 결산시 이전 요소에 초점을두고 복원시 모달에 초점을 맞추는 것을 제안합니다. 유용성을 향상시키기 위해 쿠키를 사용하여 디스플레이를 추적하는 데 몇 시간 또는 며칠마다 모달을 보여주는 것이 좋습니다.
구현 세부 사항 :
코드는 다음과 같습니다
jQuery and Colorbox :
모달 창 생성 및 관리. 이 기사는 CDN을 통해 이러한 라이브러리를 포함시키기위한 코드 스 니펫을 제공합니다.
setTimeout()
:
모달이 나타나기 전에 지연을 제어하려면
: 색상 박스 모달을 직접 표시하려면 HTML 컨텐츠, 스타일의 클래스 이름 및 치수를 지정합니다.
및 이벤트 :
초점 관리를 처리하고 (
메서드 사용) 닫고 후 초점을 복원합니다.
- : 모달 디스플레이의 주파수를 제어하기위한 쿠키를 설정하고 점검합니다.
이 기사에는 코드펜에 대한 완전한 작업 예제가 포함되어 있으며, 디스플레이 주파수를 제한하고 초점을 관리하기 위해 쿠키를 설정하는 방법을 보여줍니다. 또한 시간 지연, 브라우저 호환성 및 대체 방법에 관한 일반적인 질문도 다루고 있습니다. FAQ 섹션은 부트 스트랩 사용 및 청소 시간 초과를 포함하여 타임 메달 팝업 구현의 다양한 측면을 다룹니다.
위 내용은 Quick Tip : 시간 지연 후 모달 팝업을 표시하십시오의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!