0
조회 수 : 13174 신고 : 0
미리보기 : |
---|
이팁은 나라디자인 ( http://www.naradesign.com ) 블로그에서 가져온 팁입니다.
흔히 "따라다니는 스크롤배너" 라는 팁으로 자바스크립트와 함께 사용되어져 왔었는데, 자바스크립트는 전혀 사용하지 않고 CSS Hack을 사용하여 IE6 에서 position:fixed 상태의 레이어를 구현할 수 있는 팁이라고 할수있습니다.
css code
* { margin:0; padding:0;} /* html, body 사이의 간격을 제거 */
html { _overflow:hidden;} /* 기본 스크롤 제거 */
body{ _height:100%; _width:100%; _overflow:auto;} /* 대체 스크롤 생성 */
#content { width:580px; height:1000px; margin:20px; padding:10px; background:#eeeeee;}
#aside { position:fixed; _position:absolute; _z-index:-1; left:650px; top:20px; width:100px; height:300px; padding:10px; background:#dddddd;}
html code
<div id="content">
<h1>Fixed Layer Hack for IE6</h1>
</div>
<div id="aside">
<h2>Example</h2>
</div>
호환되는 브라우저
* Firefox2, Opera9, Safari2, IE6~7 에서 모두 동일하게 position:fixed 형태로 렌더링 합니다.
* IE5.0~IE5.5 버전의 브라우저에서는 position:absolute 형태로 렌더링 합니다.
* DTD가 Quirks Mode 상태일 때에는 적용되지 않습니다.
자세한 사항은 나라디자인 (정찬명님) 사이트에서 확인 하시기 바랍니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시 아이콘이 붙게됩니다.
- 추천수 50개이상
- 추천수 30개이상
- 추천수 20개이상
- 추천수 10개이상
- 추천수 3개이상
첫번째 댓글을 남겨주세요!