Doit HTML5+CSS3라는 책을 보고 있었다.
svg 파일을 표시할수 없는 경우(안드로이드 2.3 이하 등) png파일로 경로를 구분짖는 방법으로 Modernizr에서 custom.js를 받아 사용하도록 설명되어 있었다.
1. Modernizer?
2. 내가 사용해본 것들
3. 설치 및 사용하기
1. Modernizer?
- 오픈소스 javascript 라이브러리로, 기능별 javascript 자동으로 생성해 준다.
- UA sniffing을 위해 사용한다.
UA(User Agent) sniffing: 사용자 디바이스, 브라우저, 버전, 운영체재등 정보를 포함한 User 식별정보로 brower sniffing의 상위개념으로 이해한다.
*brower sniffing을 위해 자주 사용한 것 같다. front-end에서 주로 사용되며, 유저의 브라우저 환경을 인식하여 적합한 기능을 제공하는 방식이다. - 음.. brower 마다 HTML5+CSS3를 지원하는 수준이 다름으로 자주사용된다고 한다.
- document에서는 UA sniffing으로 표현하고 있어 더 큰 의미의 scrpit를 제공하는 듯 하다.
2. 내가 사용해본 것들(계속 수정될 예정)
- SVG as an img tag source : svg 지원되는 경우와 지원되지 않는 경우로 나누어 다른 파일 제공
<head>
<meta ~>
<title>...</title>
<script src="modernizr-custom.js"></script>
</head>
<body>
<img src="imges/~.svg">
<script>
if (!Modernizr.svg) {
$("img").attr("src", "images/~.png);
}
</script>
</body>3. 설치 및 사용하기 document
-
- 자동빌스 사용
- modernizr download page에서 필요한 기능만 선택한 후
- "BUILD"를 누르면 자동으로 빌드해준다.
- 이걸 사용할 디렉토리로 옮겨서 사용
- 사용시 코드는 해당 기능을 선택할 때 examples로 확인한다
- npm이 설치되어 있는 경우
- 설치 :
npm install -g modrnizer - 수동/자동 빌드가 있고 document를 참고하라
- 설치 :
N잡러 대충 이것저것 해보며 대충 사는 중