|
Javascript & JQuery & CSS > 구버전 IE가 HTML5, CSS3를 알아듣도록 만드는 법
딘 에드워즈라는 사람이 만든 ie7.js라는 라이브러리를 소개합니다. 요즘은 ie9.js까지 버전업이 되었네요.
http://code.google.com/p/ie7-js/
웹페이지의 <head> </head> 부분에 아래와 같이 넣어주면
<!--[if lt IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js">IE7_PNG_SUFFIX=".png";</script>
<![endif]-->
IE6, IE7, IE8이 제대로 알아듣지 못하는 CSS도 마지 IE9처럼 너무너무 착하게 잘 알아듣게 됩니다.
예) :hover, :first-child, :last-child, min-height, max-width, position: fixed, opacity (투명도), "태그 > 태그" 문법 등
투명한 배경의 PNG 이미지도 잘 나오고요...
아래의 라이브러리들과 함께 사용하면 더 좋습니다.
html5shiv: http://code.google.com/p/html5shiv/
구버전 IE가 <header>, <nav>, <article> 등 HTML5 태그를 알아듣도록 해줍니다.
css3pie: http://css3pie.com/
구버전 IE에서도 동글동글한 외곽선, 그림자, 그라데이션 등의 CSS3 효과를 사용할 수 있도록 해줍니다.
이렇게 해놓고 IE9, IE10, 파폭, 크롬 등 최신 브라우저에서 홈페이지를 만들면
IE8과 IE7에서도 대부분 그대로 나오는 신기한 체험을 할 수 있습니다.
IE6은 아무래도 구제불능이더군요. 전 그냥 포기했음.
http://code.google.com/p/ie7-js/
웹페이지의 <head> </head> 부분에 아래와 같이 넣어주면
<!--[if lt IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js">IE7_PNG_SUFFIX=".png";</script>
<![endif]-->
IE6, IE7, IE8이 제대로 알아듣지 못하는 CSS도 마지 IE9처럼 너무너무 착하게 잘 알아듣게 됩니다.
예) :hover, :first-child, :last-child, min-height, max-width, position: fixed, opacity (투명도), "태그 > 태그" 문법 등
투명한 배경의 PNG 이미지도 잘 나오고요...
아래의 라이브러리들과 함께 사용하면 더 좋습니다.
html5shiv: http://code.google.com/p/html5shiv/
구버전 IE가 <header>, <nav>, <article> 등 HTML5 태그를 알아듣도록 해줍니다.
css3pie: http://css3pie.com/
구버전 IE에서도 동글동글한 외곽선, 그림자, 그라데이션 등의 CSS3 효과를 사용할 수 있도록 해줍니다.
이렇게 해놓고 IE9, IE10, 파폭, 크롬 등 최신 브라우저에서 홈페이지를 만들면
IE8과 IE7에서도 대부분 그대로 나오는 신기한 체험을 할 수 있습니다.
IE6은 아무래도 구제불능이더군요. 전 그냥 포기했음.
|
|
||||
|
이메일 문의 : cak0280@nate.com Copyright 2000 By ENTERSOFT.KR All Rights Reserved. |