IE Button Fix

<h3>개요</h3>
<p>
    <a href="http://alex.tsd.net.au/cpill/2005/07/27/ie-button-bug/">IE의 &lt;button&gt; 태그는 value 속성을 제대로 표시하지 못하는 버그</a>가 있습니다.
    그래서 많은 웹 제작자들은 &lt;button&gt; 태그보다 활용성이 떨어지는 &lt;input&gt; 태그를 울며 겨자먹기로 사용하고 있습니다.
    Button Fix 라이브러리는 IE5 부터 IE7까지의 &lt;button&gt; 태그 사용을 가능하게 하며,
    IE 외 &lt;button&gt; 태그의 버그가 없는 다른 브라우저에서는
    <a href="http://hooney.net/2007/08/27/451/">IE Conditional Comments 필터링</a>을 통해 아무런 일도 하지 않습니다.
    <a href="#restriction">제약사항</a>을 참고하시어 사용하시면 &lt;button&gt; 태그의 장점을 이용하실 수 있으리라 생각합니다.
</p>
<h3>사용법</h3>
<p>
    <abbr title="HyperText Markup Language">HTML</abbr> 파일의 맨 마지막에 이 스크립트를 넣어주세요.
    혹은 사이트의 정책 상 자바스크립트를 &lt;head&gt; 태그에 넣어야 하는 경우 buttonfix.js의 Button Fix 함수 호출 부분을
    수정하여 사용할 수 있습니다.
</p>
<pre><code class="html">&lt;!--[if lte IE 7]&gt;

<script type="text/javascript" src="buttonfix.js"></script> <![endif]–>

제약사항

Button Fix 라이브러리는 IE5, IE6, IE7 브라우저에서 정상적으로 작동합니다. IE4와 그 이전 버전의 IE는 무시합니다. 본 라이브러리를 사용하여 <button> 태그를 구사하실 경우 IE4와 그 이전 버전에서는 귀하의 사이트를 제대로 이용하지 못할 수 있습니다.

Button Fix 라이브러리는 IE의 <button> 태그의 버그를 보완하기 위해서 자바스크립트를 통한 추가적인 마크업을 삽입합니다. name 속성을 가지고 있는 모든 <button> 태그의 바로 이전에 hidden 타입의 <input> 태그가 그것입니다. 이는 CSS나 자바스크립트를 작성할 때 예기치 못한 상황을 야기할 수 있습니다.

자바스크립트를 통해 브라우저의 버그를 보완하는 방식의 라이브러리인 관계로 대상 브라우저인 IE5, IE6, IE7 등에서 자바스크립트 기능을 비활성화하여 사용하는 경우 라이브러리를 사용하지 않는 것과 같은 - 버그가 적용된 - 결과가 됩니다.

예제

글 목록에서 선택한 글을 삭제하거나 이동하는 기능을 가진 문서 예제를 제공합니다.

다운로드

Button Fix 0.1 (4KB) - 2008년 1월 3일