본문 바로가기

ios3

[HTML] 아이폰(iOS) 사파리(Safari) 전화번호 인식 차단 아이폰이나 아이패드의 iOS용 사파리(Safari)에서 전화번호를 자동으로 인식하여 a태그로 변경하는 것을 차단하는 방법 [html] 전화번호: 02-111-1111 별다른 css 없이 html을 위와 같이 작성하여도 iOS의 사파리(Safari)에는 전화번호를 a태그로 변경하여 아래처럼 표시한다. iOS의 사파리(Safari) 전화번호 자동 인식 기능을 차단하려면 아래의 메타태그 한 줄만 추가해주면 된다. [html] 메타태그를 삽입하고 확인해보면 아래처럼 정상적으로 표시되는 것을 확인할 수 있다. 2023. 8. 20.
[jQuery] 팝업(popup) / 모달(Modal) 시 스크롤 비활성화 (iOS 포함 모든 기기) 팝업(popup)이나 모달(modal) 사용 시 바디의 스크롤(scroll)을 비활성화 하는 방법 iOS(아이폰)를 포함한 모든 기기에 대응 [html] section1 section2 popup popup toggle [css] *{ margin: 0; padding: 0; } body { width: 100%; } section { height: 600px; } .section1 { background: yellowgreen; } .section2 { background: skyblue; } .popup { display: none; position: fixed; left: 0; top: 0; width: 80%; height: 80vh; background: violet; } .popup.activ.. 2023. 7. 25.
[jQuery] 아이폰(iOS) 사파리 바운스 스크롤(bounce scroll) 대응 헤더 제이쿼리(jQuery)를 이용하여 아이폰(iOS) 사파리 바운스 스크롤(bounce scroll) 감지 대응하기 스크롤 방향에 따라 헤더(header) 숨김/표시 처리를 하여도 아이폰(iOS)의 사파리에서 상단으로 이동할때 바운스 스크롤 이펙트가 작동하면 스크롤 위치가 마이너스로 인식되어 헤더가 표시되지 않는다. 문제는 상단에서 바운스 스크롤 이펙트가 작동하고 있을때와 이펙트가 종료되었을 때 모두 헤더가 표시되지 않는다. 해결 방법은 기존 방향 감지 이벤트에서 스크롤 위치가 마이너스라도 헤더가 표시될 수 있게만 추가하면 된다. [js] let lastScroll = 0; $(window).scroll(function(){ let nowScroll = $(this).scrollTop(); if (lastS.. 2023. 6. 16.
728x90