본문 바로가기

Issues/Mobile(Web&App)

[html & ios] 전화번호가 들어있는 span태그로 감싼 텍스트인데 전화가 되고 css가 이상할때
상황 safari에서만 그냥 123-456-789 span 태그로 감싼 텍스트인데 누르면 전화기능이 되면서 컬러가 검정색으로 고정되어서 아무리 important를 줘도 안먹을때 원인 mac으로 연결해서 확인해보니 ios에서는 태그안에 전화번호가 있으면 전화로 인식하고 태그 자체를 a태그로 바꿔버림. 123-456-789 그리고 해당 페이지에 a태그 색상이 #000으로 고정이었음. 해결 태그로 변경하거나 a 태그라고 생각하고 줘야함. 단 안드로이드에서는 span 태그로 그대로 나오니 참고!
[IOS & javascript] ios 이모티콘 키패드 height 조정하기 (emoji keypad window resize)
상황 앱에서 키패드를 이모티콘으로 변경했을때 height가 높아져 입력란이 가려짐 이슈 해결 1. window.visualViewport window.resize를 해봤는데 앱이라 그런지 안됨.. 찾아보다가 window.visualViewport로 해결 간단하게 정리한 소스 !! function resizeKeypad = () => { requestAnimationFrame(() => { //필요한 함수 실행 }) } window.visualViewport.addEventListener("resize", resizeKeypad) 전체소스 $(function () { let flag = false; function handler(e) { if (flag) return; flag = true; request..
[CSS& Mobile] 모바일 브라우저 주소창과 바텀시트 고정시키기
주소창과 바텀시트 고정시키기 body { overflow: hidden; position: fixed; } .wrapper { position: absolute; /*또는 position: fixed도 상관없음. 띄워져만 있으면 됨.*/ } BODY 에 overflow: hidden; position: fixed; 를 주면 모바일에서 브라우저의 주소창과 풋터가 움직이지 않는다. 대신 콘텐츠는 body위에 띄워져 있어야한다.
[APP & javascript] ios, Android 앱 마켓 이동하기(+ ios 앱스토어 이동 오류)
이슈 flow (safari) 앱이 있음 > ~앱으로 이동하시겠습니까? confirm 이 뜸 > 2.5초 전 누르면 즉시 앱 실행 (앱으로 이동했기때문에 더이상 js가 타지않아 마켓 실행되지않음) > 2.5초 후 누르면 > 앱 실행 > 마켓으로 이동 (confirm이 뜬 상태라 js는 이미 실행되었어야하는데 막힌상태. confirm닫자마자 js 차례로 실행됨. 앱이 있는데도 마켓으로 실행이 됨) 아래 소스는 기존 소스로 javascript 앱 마켓이동, 앱 다운로드 유도 등으로 인터넷에 치면 자주 보이는 소스이다. ios 같은 경우에는 앱이 있는지 없는지에 대한 callback이 없으므로 유저의 앱의 다운로드 유무에 대해 알수가 없다. 따라서 앱을 실행하고 일정시간 이후에 그 페이지에 계속 남아있다면 앱..
[IOS & javascript] new Date() invalid date 오류!
문제상황 new Date("2021-10-10 10:00:00");​ 기본 new Date()를 사용했는데 IOS 에서 invalid date 가 나옴. 해결방법 new Date("2021-10-10T10:00:00"); IOS 경우에는 가운데에 T를 넣어주면 해결된다. 또는 moment 라이브러리를 사용하는 것을 추천한다.

티스토리툴바