클릭 가능한 경계 셀은

은 이미있는 테이블에 클릭 할 수있는 세포를 만들었습니다클릭 가능한 경계 셀은

<td> 
    <a href="link.hmlt" style = "display:block; width:100%;height:100%> &nbsp;</a> 
</td>

그러나 테이블이 표시 테두리를 가지고 있으며, 마우스가 정확히이 국경 개 이상의 링크가있는 경우 작동하지 않습니다.

경계를 클릭 할 수있게 만들려면 어떻게해야합니까? 나는 자바 스크립트 솔루션을 시도했다 : 여기

<td onclick="document.location='link.html'" > </td>

국경이 처리를하지만,이 경우의 "특별한"유형이 제대로 처리되지 클릭 있기 때문에,하지 만족입니다 (예 : "CTRL + 클릭"하지 않습니다 새 탭을여십시오).

HTML/CSS에서 테두리를 클릭 할 수있게 할 수 있습니까? 자바 스크립트를 사용해야합니까?

편집 : 여기에 내가 지금 가지고있는 최소한의 샘플입니다 : http://jsfiddle.net/pUunJ/1/

출처

2014-07-08 Sebastien

I의 링크를 연결하는 국경을 적용 포함하도록 링크를하려는 경우, 테이블 셀에 테두리를 적용입니다 셀의 "테두리"를 클릭하려고하지만 셀의 일부인 이유를 정확히 알지 못하면 클릭 이벤트를 등록해야합니다. 그 외에도 별도의 개체로 취급되지 않으므로 경계에서 클릭 이벤트를 처리 할 수있는 방법이 없습니다. JSFiddle을 제공 할 수 있습니까? 덧붙여서, 첫번째 코드 블록' WebWanderer

테두리는 셀의 일부이며 요소 너비 계산에 포함되어 있으므로 클릭 할 수 있어야합니다. http://jsfiddle.net/tnetG/1/ – TylerH

@TylerH 탭의 셀과 시각적으로 동일하지 않습니다. : http://jsfiddle.net/pUunJ/1/ – Sebastien

우선은 멀리 인라인 스타일과 인라인 자바 스크립트에서있어. 난 당신이 발급 생각

는 국경 대신 테이블 셀

td { 
    padding: 0; 
} 
a { 
    height: 100%; 
    width: 100%; 
    display: block; 
    border: 5px solid black; 
}

JSFIDDLE

출처

2014-07-08 18:08:39 svendjokumsen

이러한 경계선은 매우 작습니다. 어쩌면 그들을 5px (나중에)로 만들면 쉽게 클릭 할 수 있습니까? :-) – TylerH

크기를 변경했습니다. – svendjokumsen

고마워요,하지만 이제는 테두리가 내부 셀의 크기의 두 배입니다. http://jsfiddle.net/2MCEz/2/ 게다가, Chrome에서 상자 크기 계산이 엉망입니다.) ... – Sebastien

클릭 가능한 경계 셀은

답변

관련 문제