목록Html (9)
진스
datepicker 사용중에 가상키보드와 겹쳐서 picker사용이 힘들고 스크립트 실행에 방해될때 1. onfocus="this.blur()" 2. html5에서 도입
보호되어 있는 글입니다.
.cate_no_contents .youtube_video{position:relative;padding-bottom:56.25%; margin: 0 auto} .cate_no_contents .youtube_video iframe{position:absolute; top: 0; left: 0; right: 0; bottom: 0; width:100%; height: 100%;} 자식요소 (iframe)에 position : absolute로 설정, 부모 요소(youtube_video)는 padding-bottom 값을 56.25% 설정 여기서 56.25%는 16: 9 비율을 계산했을때 높이가 가로에 비해 56.25%를 차지하기 때문
https://github.com/lezhin/accessibility/tree/master/aria GitHub - lezhin/accessibility: 모두를 위한 설계. 레진 웹 접근성 가이드라인. 모두를 위한 설계. 레진 웹 접근성 가이드라인. Contribute to lezhin/accessibility development by creating an account on GitHub. github.com 레진 WAI-ARIA 가이드라인 WAI-ARIA는 HTML의 접근성 문제를 보완하는 W3C 명세입니다. WAI-ARIA는 HTML 요소에 role 또는 aria-* 속성을 추가하여 콘텐츠의 '역할(roles), 상태(states), 속성(properties)' 정보를 보조기기에 제공합니다. H..
출처: https://nykim.work/96 버튼에 타입을 쓰는 이유 (button type="button") 프롤로그 가끔 이렇게 type을 명시한 버튼을 마주칠 때가 있는데 전 항상 궁금하더라구요. "아니 버튼이면 버튼이지 버튼 타입 버튼은 대체 뭐람" 그러고보면 비슷하게 타입을 명시하는 이라는 nykim.work 가끔 이렇게 type을 명시한 버튼을 마주칠 때가 있는데 전 항상 궁금하더라구요. "아니 버튼이면 버튼이지 버튼 타입 버튼은 대체 뭐람" 그러고보면 비슷하게 타입을 명시하는 이라는 것도 있었던 거 같은데요...? 도대체 타입은 왜 달려있는가! 그 이유를 한번 찾아보았습니다 🔍 버튼 타입 = 버튼? Q. button에 type="button" 을 지정해주는 이유? A. 그게 디폴트가 아니니..
class 속성을 사용하는 것과 유사하다. 예를 들어 type image인 요소를 버튼처럼 사용하려면 다음처럼 해당 input 요소의 속성에 button 값을 저장하면 된다. 이 방법의 장점은 개발자 스스로 input 이미지의 역할이 버튼이라는 것을 바로 알수 있다는 것이다. 더 깊이 생각해보면 브라우저나 기타 다른 기기, 장애인과 더불어 모든 사용자가 더 쉽게 이 요소에 접근할 수 있다는 장점도 있다. aria- 접두어를 사용하여 요소의 상태를 정의 해당 요소가 선택되거나 엔터 키가 입력되었을 때 자바스크립트를 사용해서 aria-pressed 상태 값을 변경할 수 있다. 출처: https://webdir.tistory.com/89 [WEBDIR]
검사 사이트 모음 웹 접근성 검사 사이트 모음 웹 접근성 검사 사이트 웹 접근성 마크를 획득하기 위해서는 꽤 많은 비용이 듭니다. * 20페이지 이하 기준으로 120만원 재심사의 경우 60% 감면해준다고 하지만 그래도 많은 돈이죠. 그렇기 때문 eunyoe.tistory.com openwax [Chrome/openWax/웹접근성검사]openWax로 웹접근성 검사 해보기 배포대기 중인 프로젝트에서 웹 접근성 검사를 맡아서 했다. 웹 접근성은 어떻게 검사해야하는지 정보가 잘 안나와있어서 검사사이트를 사용해야 하는건지, 체크리스트를 사용해야 하는 건지 jininote.tistory.com 그외 wave 등도있음
jQuery - input 숫자 하나만 입력 후 다음 칸으로 이동하기(모바일 비밀번호 입력 처리하기) 비밀번호등을 받기 위해 숫자나 특정 단어 하나씩 입력하고 다음칸으로 이동하는 형태의 UI를 많이 접할 수 있습니다. 해당 포스팅에서는 하나의 Input태그마다 입력을 받으면 다음칸으로 이동하 myhappyman.tistory.com 비밀번호등을 받기 위해 숫자나 특정 단어 하나씩 입력하고 다음칸으로 이동하는 형태의 UI를 많이 접할 수 있습니다. 해당 포스팅에서는 하나의 Input태그마다 입력을 받으면 다음칸으로 이동하고 숫자만 받는 형태를 작성해보겠습니다. 단순하게 maxlength와 number값 타입을 지정하더라도 영문 'e' 또는 한글 자음 모음등이 입력되는 현상😓을 볼 수 있는데, 정규식과 사용..