반응형

전체 글 99

Input Type="number" 일 때, iOS에서 숫자 키보드 안뜨는 문제

숫자만 입력 받을 수 있는 Input 요소를 만들기 위해 input type="number"로 지정하여 사용합니다. 안드로이드의 경우, type만 "number"로 지정하면 숫자 키보드가 뜨는데, iOS는 일반 키보드가 뜨는 것을 확인 할 수 있습니다. iOS에서도 숫자 키패드만 뜨도록 하기 위해서는 아래와 같이 패턴을 넣어주면 iOS 숫자 키보드가 뜨는 것을 확인할 수 있습니다.

HTML&CSS 2020.02.25

[JavaScript] Math 정리

Math Object는 수학적인 일을 수행한다. Math Object Properties Property 설명 E 오일러 수 값 (Euler's number, 약 2.718) LN2 자연로그 log2 값 (약 0.693) LN10 자연로그 log10 값 (약 2.302) LOG2E 2를 밑으로 하는 logE 값 (약 1.442) LOG10E 10을 밑으로 하는 logE 값 (약 0.434) PI PI 값 (약 3.14) SQRT1_2 루트 1/2 값 (약 0.707) SQRT2 루트 2 값 (약 1.414) Math Object Methods Method 설명 예제 예제 결과 abs(x) 절대 값을 반환한다. Math.abs(-10) 10 ceil(x) 가장 근접한 정수로 올림. Math.ceil(11...

JavaScript 2019.12.10

#03 Tutorial (Multiple Components)

Naming Convention Component 파일은 '.component'로 파일이름이 끝나야한다. 그리고 소문자와 dash('-')로 구성된 이름을 사용한다. ex) hero-detail.component.ts - component 파일의 구성은 다음과 같다. import { Component, Input } from '@angular/core'; @Component({ selector: 'my-hero-detail', template: ` {{hero.name}} details! id: {{hero.id}} name: ` }) export class HeroDetailComponent { } 1. Component와 Input을 import한다. 2. @Component 키워드를 사용해서 Com..

Angular 2019.12.09

#02 Tutorial (ngIf, ngFor)

- ngFor를 이용해서 배열을 출력할 수 있다. ngFor를 쓸때는 반드시 앞에 *를 붙여줘야한다. {{hero.id}} {{hero.name}} - Style도 `를 이용하여 멀티 라인 텍스트로 사용가능하다. styles: [` .selected { background-color: #CFD8DC !important; color: white; } .heroes { margin: 0 0 2em 0; list-style-type: none; ... ... ... margin-right: .8em; border-radius: 4px 0 0 4px; } `] - ngIf를 사용하면 해당 데이터가 있을 때만, 보여주게 할 수 있다. ngIf 또한 앞에 *를 반드시 붙여줘야한다. {{selectedHero.nam..

Angular 2019.12.08

#01 Tutorial (ngModel)

1. 객체의 값을 보여주기 위한 단방향 데이터 바인딩을 위해서 이중 괄호 보간법을 사용한다. template: '{{title}}{{hero.name}} details!' 2. 멀티 라인 템플릿을 사용하기 위해서 ES2015의 템플릿 문자열을 사용한다. template:` {{title}} {{hero.name}} details! id: {{hero.id}} name: {{hero.name}} ` 3. ngModel을 이용하여 양방향 데이터 바인딩을 할 수 있다. '' 4. ngModel은 바인딩되어 있는 모든 곳에 변화를 전파한다.

Angular 2019.12.07

최대 URL 길이에 대한 연구

Internet Explorer 11 주소 창에서 실행 2,047자 C# winForm 환경에서 WebBrowser Navigate 실행시 샘플 프로그램을 작성하여 테스트했습니다. 2,083자 FireFox >100 KB Opera >200 KB Chrome, Safari >100 KB 이러한 URL 길이에 대한 제한은 서버에도 영향을 끼치기 때문에 서버에 제한이 걸린 경우도 있습니다. Apache >128 KB 참고로, Tomcat으로 테스트해봤는데 위 사진과 같은 에러가 발생했습니다. "java.lang.IllegalArgumentException: 요청 헤더가 너무 큽니다." 이 에러가 발생하면 URL 길이가 너무 긴 것이 아닐지 확인해야합니다. IIS >16 KB Lotus Notes 4 KB 참..

HTML&CSS 2019.12.04

[JavaScript][IE] script65535: 호출 개체가 잘못되었습니다.

Internet Explorer에서만 발생한 오류입니다. var obj = {}; toString.call(obj); 위와 같이 toString을 호출하며 obj를 매개변수로 던졌더니 오류가 발생했습니다. 참고로 Chrome에서는 정상적으로 동작하지만 IE에서만 발생한 문제입니다. 오류가 발생한 이유는 toString.call(obj) 호출하면 Object.prototype.toString 함수가 호출되는 것이 아니라 window.toString 함수가 호출됩니다. window.toString의 경우 스펙이 없기 때문에 window.toString에 대한 구현은 브라우저마다 차이가 날 수 있습니다. Chrome에서는 자연스럽게 Object.prototype.toString 연결시켜줬지만, IE에는 그렇게..

JavaScript 2019.07.08

[HTML5] Audio

Audio 태그는 웹 페이지 내에서 오디오를 내장하기 위한 기본적인 방법입니다. 크롬도 지원하고 Internet Explorer도 9.0부터 지원합니다. 아주 휼륭하죠? 기본적인 사용법은 안에 태그를 넣으면 됩니다. 아래와 같이 테스트를 해볼 수 있습니다. 테스트를 해보니 Source의 순서도 의미가 있는 것을 확인했습니다. 위쪽 Source가 우선순위를 가지고 사용됩니다. 만약 지원하지 않는 포멧이라면, 다면 다음 소스를 사용합니다. 그렇다면 Audio에 Base64 문자열을 source로 쓸 수 있을까요? 한 번 테스트를 해보았습니다. 샘플은 아래와 같습니다. Source 태그를 반드시 사용해야하는 것은 아니기 때문에 생략했습니다. Base64 문자열로도 사용할 수 있음을 확인했습니다.

HTML&CSS 2018.08.13
반응형