일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- styled component
- 임고미
- SafeArea 커스텀
- React Native SafeArea Custom
- styled component is not working
- 프론트앤드
- gsap
- reactnative 웹뷰 페이지 로딩
- styled component 작동 안될때
- rn webview page loading
- 퍼블리셔
- react
- React-Native IOS
- React Native navigation
- 리액트
- safari wiondow.open
- React-Native 공부
- react이론
- input 숫자입력
- JS
- styled component 작동안함
- slick slider 간격
- 트윈맥스 기초
- js 특정 위치로 이동
- react native safeArea
- gsap 기초
- scrollIntoView scrollTo
- RN navitate push
- 타입스크립트
- 웹뷰 페이지 로딩
- Today
- Total
목록퍼블리싱/html css js (35)
개발공부 임고미
데이터 세팅 - 반복문을 사용하여 id를 출력해보기 let products = [ { id: 'apple', }, { id: 'banana', }, { id: 'orange', }, { id: 'avocado', }, { id: 'peach', }, { id: 'kiwi', }, ]; for 초기값에서 조건부에 부합하면 계속 순회합니다. 특징 : break 문을 사용 할 수 있습니다. - 특정 조건을 만나면 멈추는것 1) 처음부터 배열의 길이만큼출력하기 for( let i=0; i < products.length; i++) { console.log(products[i].id); } : apple ~ kiwi까지 출력됨 2) 'orange'를 발견하면 반복문 멈추기 for( let i=0; i < prod..
chrome에서는 문제가 없었으나, ie를 확인하는 과정에서 이름, 전화번호, 이메일 등 다 입력 후 다음 우편번호 api를 통해 우편번호를 받아온 뒤, 상세 주소를 입력하기 위해 input창을 클릭하자 focus가 걸리지 않는 문제가 발생했다. 해결 방법: 우편번호 결과가 들어오는 함수에서 상세주소 input에 inputName.focus(); 걸어주면 해결 (document.getElementById("detail-address") as HTMLInputElement).focus(); - 리액트에서 해당 문제를 맞닿뜨려서 이렇게 해결했는데, js에서도 마찬가지로 focus() 함수를 사용하면 됩니다. + 추가 내가 ie에서 격은 문제 상황을 좀 더 서술하자면 해당 페이지는 결제 페이지였고, 최초 진입..
1. html에 swiper를 만들어줍니다. 2. 원하는 크기를 설정해줍니다. .swiper-container-mainNav .swiper-wrapper { width: auto !important; } .swiper-container-mainNav .swiper-wrapper .swiper-slide { width: 190px !important; } .swiper-container-mainNav .swiper-wrapper .swiper-slide:nth-child(3) { width: 140px !important; } 원래 스와이퍼에서 제공하는 css가 있어서, 내가 정한 크기가 무시될 수 있으므로 !important 를 넣어줍니다. 저는 190px과 140px 두가지 크기를 설정하였습니다. 3...
아이폰이 javascript에서 'click'에 대한 민감도가 낮아서 클릭이 잘 안되는 경우가 있는데 이럴땐 click을 touchend로 바꿔 사용해주면 된다. var clickTouch = (function () { if ('ontouchend' in document.documentElement === true) return 'touchend'; else return 'click'; })(); 사용 $(document).on(clickEvent, '.btn', function(e) { console.log('건들였다!') }) 그런데 너무 예민하므로, 필요할때 잘 사용할것
1. type text/ tel 간단하게 설정가능 2. type number //html //js //숫자 maxLength check function maxLengthCheck(object){ if (object.value.length > object.maxLength){ object.value = object.value.slice(0, object.maxLength); } } tel 이나 number으로 type을 설정할경우, mobile에서 input focus되면 숫자키보드만 뜬다. ( text같은경우엔, 자판까지 뜬다. )
select box placehorder 만들기 1. html 완전 placehorder 처럼 만들기위해선 disabled와 hidden 속성이 필요합니다. 기본값입니다. 바다 산 계곡 빨강 노랑 파랑 여기서, "기본값입니다." 만 placeholder취급해서 기본값으로 바꾸는게 목적 이게 만약 opt그룹이 아니었다면, option:first-child로 간단하게 처리가 가능했을 수도 있다. 그런데 opt 그룹이 되면서 opt 그룹의 첫번째요소도 색이 변하는걸 확인할 수 있다. /* css */ select option:first-child { color: red; } 확인시켜주고자 html 에서 hidden 과 disable을 제거한 상태 완벽한 placehorder을 만들고자, 다음과 같이 진행 2...
function agreeAll() { var chkbox = document.getElementsByClassName('agree'); var chk = false; for(var i=0 ; i
html html에 들어갈 위치 만들어주기 Js 시 + 분 + 초 //시 분 초 var countDownDate = new Date('2020-09-18').getTime() + (1000 * 60 * 60 * 15); var x = setInterval(function () { var now = new Date().getTime(); distance = countDownDate - now; if (distance > 0) { var h = Math.floor(distance / (1000 * 60 * 60)); var m = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); var s = Math.floor((distance % (1000 * 60))..