요소 클릭 안 되는 경우 (7가지)
1. ★
z-index 높은 다른 안 보이는 요소가 가리고 있는 경우. (가장 흔한 경우)
https://homzzang.com/b/css-113
해결책 : 다른 요소보다 z-index 값을 높게 설정.
2.
preventDefault() 메서드에 의해 요소 기본 동작 차단된 경우.
https://homzzang.com/b/js-1445
https://homzzang.com/b/jquery-120
해결책 : 선택자를 변경하거나, preventDefault() 메서드 해제.
3.
해당 선택자와 동일 선택자가 다른 곳에서 사용되어 클릭이벤트로 다른 동작 정의된 경우.
(예) 리모콘 .top 클래스 안 링크 클릭 시, 최상단 영역 .top 클래스 안 링크들이 작동 X
$(" .top").on("click", function(e) {
$("html, body").animate({scrollTop:0}, '500');
return false;
});
해결책 : 고유한 선택자명으로 재조정. (예) $("#remocon .top")
4.
JS 동작 마무리를 return false; 안 해준 경우, 최초 동작 때만 잘 되고 이 후엔 클릭해도 작동 안 됨.
(예)
<a href="<?php echo $c_reply_href; ?>" onclick="comment_box('<?php echo $comment_id ?>', 'c'); return false;">답변</a>
5. ★
<ul> 이나 <div> 태그 너비 미설정으로 인해 가끔 안 되는 경우 발생.
해결책: <ul>, <div> 요소 너비 설정.
6.
<div><a></a></div> 태그 구조로 잘못 코딩해서, 링크 클릭 영역을 제대로 설정 안 한 경우 (관련글 보기)
(예)
<--Bad-->
<div style="width:54px; height:56px; margin:0; padding:0; background:url('https://i.imgur.com/PQNhCln.gif'); border:1px solid red;"><a href="https://homzzang.com" style="display:block;margin:0"> </a></div>
<br><br>
<--Good-->
<a href="https://homzzang.com" style="display:block; width:56px; border:1px solid red;"><img src="https://i.imgur.com/PQNhCln.gif"></a>
결과보기
7.
브라우저에 설치한 확장프로그앰이나 악성코드 영향.
해결책:
PS1. 그 외 여러 경우 있겠지만, 대부분 위 경우들 체크하시면 해결 됨.
PS2. 스타일은 인라인스타일 대신 (내부스타일/외부스타일) 사용 권장.
