분류 전체보기 249

jqeury에서 focus()가 안먹힐때

태그 예를들어 이런 태그가 있는데 focus를 줘도 안먹는 경우가 있음. 뭐 css적으로 display: none한것도 아니고, $('p').get(0).focus()이렇게도 해보고 그랬는데 결론은 그냥 셋타임아웃이 제일 효과적임. $('p').focus(); setTimeout(function() { $('p').focus(); }, 100); 난 혹시 몰라서 저런 경우 발생시 두개를 다 써놓곤 함. 시간초는 보통 100~200정도 다들 하는듯.. jquery focus() not working

html_css 2022.06.02

안드로이드, 아이폰 접근성 자막패널 열기

접근성 기능 빠르게 켰다끄기 단축키는 이곳에서 확인 가능 [https://peamexx.tistory.com/134] ----------------------------------------------------- 귀로만 듣다보면 문장을 잘못 듣거나, 단어가 헷갈리는 경우가 있음. 이럴때 자막 패널을 켜두면 텍스트로 확인하기 용이함. 안드로이드 (voice assistant) 1. 설정 - 접근성 - 스크린 리더 - 설정 - 개발자 옵션 - TTS출력 표시 아이 편해 !! 안드로이드 (talkback) 1. 설정 - 접근성 - 설치된 서비스 - talkback - 설정 - 고급 설정 - 개발자 설정 - 음성 출력 표시 생긴거는 위에 voice assistant의 자막패널과 똑같이 생김. 아이폰 1. 설정..

접근성 2022.05.25

안드로이드, 아이폰 접근성 버튼 빨리 여는법, 단축키, 빠른실행, 숏컷

접근성 테스트를 하려면 빨리 켜고 빨리 꺼야하는데 매번 설정에 들어가서 켜서 다시 빠져나오는게 너무 불편했었음. 그러다가 빠른실행 방법을 알게되서 정리함. ----------------------------------------- 참고로 talkback과 voice assistant 차이점도 정리해봄. talkback은 안드로이드 기존 스크린리더이며, voice assistant는 삼성에서 만든 스크린리더로 갤럭시 s6부터 이용 가능함. 둘다 기본적으로 안드로이드에 설치되어있음 [https://nuli.navercorp.com/community/article/1132808]. ※ 그런데 안드로이드 11, One UI 3.0이후 업데이트로 talkback과 voice assistant을 통합하여 새로운 (..

접근성 2022.05.24

modal이 떠있을때 background focus못하게 하기

부트스트랩 모달을 쓰고 있었기때문에 기본적으로 role='dialog', aria-modal='true'이런게 다 기본적으로 되어있는데도 안드로이드에서만 스와이프하다보면 뒷배경에 focus가 가능했었음. 위 스크린샷처럼 떠있는 'save changes'가 focus된 상태에서 오른쪽으로 스와이프하면 뒷 background에 있는 다른 요소에 focus가 가버림 개빡 방법 $('header, footer').attr('aria-hidden', 'true'); 다행히도 aria-hidden을 뒷 요소들한테 다 주면 된다. modal이 켜졌을땐 true, 꺼졌을땐 false로 해주면 뒤에 안잡음. display none이나 visibility hidden이런것도 해봤는데 얘네는 자칫하면 화면이 밀려버리는 경우..

접근성 2022.05.23

ie9에서도 쓰는 promise polyfill 코드

promise, asnyc, await 이런 최신 문법들이 나왔지만 현실적으로 ie를 맞춰야한다거나 하는 상황이 벌어지면 쓸수가 없음. 그럼 콜백함수를 쓸수밖에 없는데 어쩌다보면 막 너무 지저분해지고 길어지고 하는 상황들이 벌어짐. 그래서 polyfill을 찾아보다가 유튜브에서 한번 보고 따라해봄. https://codepen.io/pmx/pen/XWZJzGM promise polyfill (IE9 맞춤) ... codepen.io ---------------------------- 아니면 이를 지원하는 라이브러리같은게 있는데 하나 아는거는 rsvp.js라서 이걸로도 한번 해봄. https://codepen.io/pmx/pen/abErVqx RSVP.js (IE9 맞춤) ... codepen.io

Javascript 2022.05.03

bootstrap modal, offcanvas에 transition 효과 지우기

modal 열때 스무스하게 열림/닫힘 효과 없애는 방법 modal은 class에 .fade 삭제 offcanvas는 css 추가 .offcanvas { transition: transform 0s; } modal은 css줘보고 난리쳤는데 그냥 저게 직빵임. class없애도 열고 닫는데 지장없음. 접근성 작업한다면 꼭 저런 스무스 애니메이션 빼길 바람(스무스한 그 찰나에 focus를 잃어버리는 등 별짓이 다 일어남)

html_css 2022.04.29

센스리더가 읽을 수 있는 커스텀 select box 코드

접근성이라는게 aria~류만 잘 써주면 되는줄 알았더니, 실제로 스크린리더 기기별로 지원하는 aria가 달랐고, 또 원래대로라면 예를들어 '목록 버튼, 랜드마크'라고 정상적으로 읽어주는 것을, 업체측 사정에 따라 알아듣기 쉽게 '목록'이라고만 읽어줘야할 때도 있었는데, 그러다보니 작업하기가 참 까다로웠음. 처음에는 그렇게 바꾸다보니 이게 접근성이 맞나 싶다가도 오히려 또 굳이 저렇게 다 길게 읽어주는걸 보니 실제 쓰려면 그래도 간결한게 맞긴맞네라는 생각도 들었음(긴거는 진짜 '텍스트 필드, 글자를 입력하려면 이중탭 하세요, 맞춤법 로터를 이용한 사용' 뭐 이런식으로 textarea하나를 저렇게 읽어댐.. 물론 이건 iOS긴 하다만) 아무튼 그와중에 select box를 태그말고 커스텀으로 만들어야하는 상..

접근성 2022.03.29

git 작업도중 변경사항 임시저장하고 싶을 때

한창 작업하고 있는데 중간에 갑자기 풀을 받아야하거나, 아니면 풀을 받았는데 원래 작업내역이 있어서 디렉토리를 먼저 정리하라는 문구가 뜰때 할수있는 방법 (아래 방법 몰랐을 때는 새로 폴더 하나 파서 git clone해서 새로 받아서 작업했던거 노가다로 복붙함ㅎㅎ) --- 1. 변경사항을 스테이징에 올려놓고 터미널에서 아래와같이 입력 git stash git stash pop 둘중에 하나만 입력하면 됨. 나는 첫번째 줄로 잘 씀. 그러면 잠깐 로딩이 있다가 변경사항에 내역이 싸악 사라짐(놀라지 말것!!) 2. 풀 받는다 3. 수정내역들을 다시 가져온다 git stash apply 그러면 다시 변경내역/스테이징 영역에 나타난다 4. stash에 있던 내역 지워주기 git stash drop 마지막으로 임시..

카테고리 없음 2022.03.02