HTML5 Boilerplate (H5BP)는 프론트엔드 개발자들이 웹페이지를 제작하는데 필요한 베스트 프랙티스들을 모아놓은 템플릿이다. 다양한 브라우저 환경, 특히 구버전의 인터넷 익스플로러(IE)에서 HTML5 + CSS3 조합의 풍부한 기능을 이용하기를 원한다면 이 H5BP의 사용은 필수불가결하다 할 수 있다. 하지만, H5BP가 만능은 아닌 것이, 다양한 브라우저를 지원하는 웹페이지를 제작하는데 꼭 필요한 최소한의 장치들만을 포함하고 있기 때문에 개발 환경에 따라 몇가지를 []

이전 글인 IE8 에서 input 태그와 textarea 태그에 placeholder 속성 적용하기에서 Placeholders.js를 이용하면 jquery.placeholder 플러그인보다 여러모로 사용이 편리하다고 언급한 적이 있다. 그런데, 이 Placeholderes.js 역시도 다른 DOM 엘리먼트들의 이벤트들에서는 기대하는 대로 작동하지 않는 경우가 있다. 이런 경우를 보정하기 위해서 Placeholders.js Monkey Patch를 만들어서 배포하게 됐다. Placehoders.js는 모든 input:text 엘리먼트와 textarea 엘리먼트에 몇가지 비표준 속성을 추가하는 []

IE8은 공식적으로 HTML5 태그들을 지원하지 않는다. 따라서, 하위 버전의 IE들을 위해 Modernzr 라든가 html5shiv 같은 자바스크립트들을 이용하면 HTML5에서 새롭게 나타난 엘리먼트 태그들을 사용할 수 있다. 그럼에도 불구하고 placeholder 속성은 IE8에서 사용할 수 없는데, 이럴 때 사용할 수 있는 jQuery 플러그인이 있다. 이름하여 jquery.placeholder. 사용법도 간단하다.

먼저 jQuery를 로딩한 다음 jquery.placeholder.js를 로딩한다. 그 다음에 다음과 []

  • 1