웹모아 
웹모아  로그인  회원가입  
웹모아
  
버턴관련테그
 


[RE] Label 태그를 Image로 하기
  등록: 2009-02-15 13:07:33 조회:6612
http://web.landmoa.net/?acmode=b_s&curjong=web001002&no=17693


<pre>
ie에서 label태그를 텍스트가 아닌 이미지로 쓸 경우의 버그

<input id="txt1" type="checkbox">
<label for="txt1">label TEXT</label>


위 코드처럼 label TEXT란 글자를 label태그로 감싼 후 checkbox의 id와 label 태그의 for값을 매칭시켜주면 아래의 예시와 같이 checkbox와 텍스트는 서로 연동되어져 동작하게 됩니다.

텍스트에 클릭을 해도 체크박스의 체크여부를 설정할 수 있습니다.




--------------------------------------------------------------------------------




그러나 label TEXT란 텍스트 대신 image형태로 처리하게 되면 IE의 경우는 label본연의 기능이 동작하지 않습니다.
(버그일까요? )

IE사용자 분들은 아래 예시를 통해 확인해보실수 있습니다.


이럴 경우 간단한 Javascript를 통해서 label 태그의 기능을 사용할수 있습니다.
(IE일경우만 동작하는 스크립트 입니다.)


<input id="img2" type="checkbox">
<label for="img2" onclick="if(navigator.appVersion.indexOf(’MSIE’) != -1){img2.click()}">
<img src="이미지경로" style="cursor:pointer">
</label>
</pre>

실행해보기   (실행2)




 

 





버턴관련테그
페이지: 1 / 1   

   label 태그8545
  [RE] Label 태그를 Image로 하기6613
   Select 꾸미기 optgroup 사용(홈마스타)6599
   체크박스라디오버튼체크유무검사.html(홈마스타)6568
   input type="file" 의 value값(홈마스타)6602
     [RE] input type=\(홈마스타)6483
     [RE] input type=\(홈마스타)6468
   input 버턴의 모양(홈마스타)6395
   중보입력 방지 루틴(홈마스타)6373
   파일업로드 버턴을 이미지로(홈마스타)306
     [RE] [JavaScript] input type(홈마스타)249
       [RE] [JavaScript] input typ(홈마스타)259
   버터느 글상자 꾸미기(홈마스타)264
   체크박스가 하나이상 체크 되었는지 검사하는 루틴(홈마스타)266
   셀렉트박스 보이는 리스트 갯수 조정(홈마스타)252
   파일 업로드 버턴을 이미지로 만들기(홈마스타)275
     [RE] 파일 업로드 버턴을 텍스트로 만들기(홈마스타)343
       [RE] 파일 업로드 버턴을 텍스트로 만들기(홈마스타)269
     [RE] 파일 업로드 버턴을 이미지로 만들기-다른 (홈마스타)261
   INPUT 을 다양하게 표현하기(홈마스타)222
   버튼에 링크걸기(홈마스타)261
   버턴크기 모양 색상 변경(홈마스타)281
   버턴 모양 부드럽게 - style 사용(홈마스타)(1) 232
   버턴 태그 관련 팁(홈마스타)(2) 238
   폼 전송 버턴(홈마스타)313
≪ [1]   ≫

복수단어 검색은 공백(space)로 구분해 주세요.



 
최근 글 자료
22
9
8
5
2722
632
619
779
706
3749
3233
3294
3627
2627
3160
 
인기글 자료
7964
3916
6568
5380
4676
6373
5027
4959
4215
4667
4978
3862
6953
4700
4803