투케이2K

[제 목]​[업무 이슈] 모바일 (Android) 웹뷰 화면에서 글자 및 레이아웃 변경 이슈 - Webview Css 스타일 변경 이슈 [내 용] ------------------------------------------------------------------------------[이슈 사항]------------------------------------------------------------------------------1. 모바일 (Android) 웹뷰 화면에서 글자 및 레이아웃이 변경 되어 화면 밀림 현상이 발생 된다는 이슈 접수------------------------------------------------------------------------------[원인 파악]----..

[개발 환경 설정] ​ 개발 툴 : XCODE 개발 언어 : SWIFT5 ​ [소스 코드] ​ // --------------------------------------------------------------- // [웹 소스코드] // --------------------------------------------------------------- 안녕하세요 // --------------------------------------------------------------- // [Swift 소스 코드] // --------------------------------------------------------------- var script = "javascript:document.getEleme..

[개발 환경 설정] ​ 개발 툴 : AndroidStudio [소스 코드] // --------------------------------------------------------------- // [웹 소스코드] // --------------------------------------------------------------- 안녕하세요 // --------------------------------------------------------------- // [안드로이드 소스코드] // --------------------------------------------------------------- try { String script = "javascript:document.getElementB..

[환경 설정 및 설명] ​ 프로그램 : AndroidStudio ​ 설 명 : [Android] 웹뷰 (Webview) 에서 자바스크립트 (js) 및 Css 변경 사항이 새롭게 적용 되지 않는 이슈 - 웹뷰 캐시 초기화 [에러 원인] ​ 1. 안드로이드 웹뷰 로딩 시 웹 (Web) 단에서 변경 된 Js , Css 등이 새롭게 반영 되지 않는 이슈 발생 [해결 방법] ------------------------------------------------------------------------------- [기존 적용 된 소스 코드 및 상태] 1. [Web] : 코드 변경이 일어 날 때 새롭게 Js 및 Css 버전 올려서 배포 (ex : twok.js?123) 2. [Android] main_webvie..

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery ​ [소스 코드] ​ [결과 출력] ​

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : jquery ​ [소스 코드] ​ [결과 출력] ​

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : AngularJS [소스 코드] ​ {{i.name}} [결과 출력] ​

[개발 환경 설정] ​ 개발 툴 : VS CODE 개발 언어 : Vue Js [소스 코드] ​ {{ msg }} {{ data }} [결과 출력] ​

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [원인] >> 아이폰, 안드로이드 모바일에서 카카오톡 링크 접속 시 인앱 브라우저 실행 >> 주소 표시줄, 네이게이션 바 자동 숨김 현상으로 UI 화면이 망가지는 경우 ​ ​ ​ ​ [해결 방법] 공통 : - 가상 키보드 밀림 현상을 방지하기 위해서 각 컨테이너 position 속성을 fixed 로 지정한다 아이폰 추가 설정 : - 자바스크립트 onresize 함수에서 >> 각 컨테이너 height , top 비율을 다시 설정 (변경된 body 해상도 확인 후 다시 비율 설정 : 자연스럽게 full screen 만들기) - 자바스크립트 onready 함수에서 카카오 인앱 브라우저 접속 확인 >> 아이폰인..

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : jquery [소스 코드] ​ ​ [결과 출력] ​ [요약 설명] ​ /* [JS 요약 설명] 1. window.onload : 브라우저 로드 완료 상태를 나타냅니다 2. children : 부모에 포함된 자식을 지정할 때 사용합니다 3. first : 부모에 포함된 첫번째 자식을 지정합니다 4. children('요소:eq(인덱스)') : 부모에 포함된 특정 요소 (div , li ..) 에서 특정 인덱스를 지정합니다 5. last : 부모에 포함된 마지막 자식을 지정합니다 */

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [요약 설명] ​

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [text-shadow: 1px 1px 1px #000;] text-shadow 를 사용해서 텍스트 글자에 그림자 표과 적용 실시 [text-shadow: 2px 2px 2px #000;] text-shadow 를 사용해서 텍스트 글자에 그림자 표과 적용 실시 [text-shadow: 2px 2px 5px #000;] text-shadow 를 사용해서 텍스트 글자에 그림자 표과 적용 실시 [결과 출력] ​ [요약 설명] ​ ​ ​

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [p 태그 : letter-spacing: 10px;] letter-spacing : 텍스트 자간 (가로 간격) 사이즈를 설정할 수 있습니다 [p 태그 : letter-spacing: 5px;] letter-spacing : 텍스트 자간 (가로 간격) 사이즈를 설정할 수 있습니다 [p 태그 : letter-spacing: 0px;] letter-spacing : 텍스트 자간 (가로 간격) 사이즈를 설정할 수 있습니다 [p 태그 : letter-spacing: -1px;] letter-spacing : 텍스트 자간 (가로 간격) 사이즈를 설정할 수 있습니다 [결과 출력] ​ [요약 설명] ..

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [div : height:10%; display: block; overflow: auto;] [p : display: table-cell;] 부모 div 스타일 height 지정 및 display block 설정, overflow 길이 초과 auto 처리 실시 자식 p 태그 스타일 display: table-cell; 처리 실시 [결과 출력] ​ [요약 설명] ​ ​ ​

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [div : height:3%; display:table; table-layout:fixed;] [p : overflow: hidden; text-overflow: ellipsis; white-space: nowrap;] 부모 div 스타일 height 지정 및 텍스트 영역 초과시 히든 처리 실시 [div : display:table; table-layout:fixed;] [p : 텍스트 영역 초과 시 히든 처리 않함] 부모 div 스타일 height 지정 없음. p 태그 텍스트 글자 수에 맞춰서 자동으로 div height 영역 높이 조절 [결과 출력] ​ [요약 설명] ​ ​ ​

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [vertical-align: top] [text-align: center] p 태그 텍스트 vertical-align: top; 속성 값은 수직 (세로) 방향 기준으로 위쪽에 정렬을 실시합니다. p 태그 text-align: center; 속성 값은 수평 (가로) 방향 기준으로 텍스트 중앙 정렬을 실시합니다 [vertical-align: middle] [text-align: center] p 태그 텍스트 vertical-align: middle; 속성 값은 수직 (세로) 방향 기준으로 중앙에 정렬을 실시합니다. p 태그 text-align: center; 속성 값은 수평 (가로) 방향 ..

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [text-align: left] [line-height: 20px] p 태그 텍스트 text-align: left 속성 값은 수평 방향 기준으로 왼쪽으로 정렬을 실시합니다. p 태그 line-height: 20px; 속성 값은 수직 방향 기준으로 줄 간격 높이를 설정 합니다 [text-align: left] [line-height: 40px] p 태그 텍스트 text-align: left 속성 값은 수평 방향 기준으로 왼쪽으로 정렬을 실시합니다. p 태그 line-height: 40px; 속성 값은 수직 방향 기준으로 줄 간격 높이를 설정 합니다 [text-align: left] [pa..

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [결과 출력] ​ [요약 설명] ​

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ [text-align: left] p 태그 텍스트 text-align: left 속성 값은 수평 방향 기준으로 왼쪽으로 정렬을 실시합니다. p 태그 vertical-align: middle; 속성 값은 수직 방향 기준으로 중앙 정렬을 실시합니다. 텍스트를 히든 처리 안하고 그냥 표시할 경우는 table-layout: fixed 설정을 하면 안됩니다. [text-align: right] p 태그 텍스트 text-align: right 속성 값은 수평 방향 기준으로 오른쪽으로 정렬을 실시합니다. p 태그 vertical-align: middle; 속성 값은 수직 방향 기준으로 중앙 정렬을 실..

[개발 환경 설정] ​ 개발 툴 : Edit++ 개발 언어 : html, css, js, jquery [소스코드] ​ TEST 20px; TEST 10px; TEST 8px; [결과 출력] ​ [요약 설명] ​ ​ ​