마우스가 테이블의 행을 넘어갈 때 손으로 커서 변경

마우스가 테이블의 행을 넘어갈 때 손으로 커서 변경

---

내 마우스가 넘어 때 손 커서 포인터를 변경하려면 어떻게 <tr>A의<table>

<table class="sortable" border-style:>
  <tr>
    <th class="tname">Name</th><th class="tage">Age</th>
  </tr>
  <tr><td class="tname">Jennifer</td><td class="tage">24</td></tr>
  <tr><td class="tname">Kate</td><td class="tage">36</td></tr>
  <tr><td class="tname">David</td><td class="tage">25</td></tr>
  <tr><td class="tname">Mark</td><td class="tage">40</td></tr>
</table>

---

실제로 CSS 로이 작업을 수행 할 수 있습니다.

.sortable tr {
    cursor: pointer;
}

---

부트 스트랩 스타일을 약간 검색하고 이것을 찾았습니다.

[role=button]{cursor:pointer}

따라서 원하는 것을 얻을 수 있다고 가정합니다.

<span role="button">hi</span>

---

내가 찾은 가장 쉬운 방법은 추가하는 것입니다

style="cursor: pointer;"

태그에.

---

cursor: pointerCSS에 추가 하십시오.

---

커서 옵션을 관리하기 위해 이것을 style.css에 추가했습니다.

.cursor-pointer{cursor: pointer;}
.cursor-croshair{cursor: crosshair;}
.cursor-eresize{cursor: e-resize;}
.cursor-move{cursor: move;}

---

IE <6과의 호환성을 위해 다음 순서로이 스타일을 사용하십시오.

.sortable:hover {
    cursor: pointer;
    cursor: hand;
}

그러나 IE <7은 요소 가있는 :hover의사 클래스 만 지원한다는 것을 기억하십시오 <a>.

---

cursor: pointer;커서를 변경하려는 요소의 CSS 스타일 을 사용하십시오 .

귀하의 경우 (.css 파일에서) 다음을 사용합니다.

.sortable {
    cursor: pointer;
}

---

CSS 커서 속성을 다음과 같이 사용하십시오 .

<table class="sortable">
  <tr>
    <th class="tname">Name</th><th class="tage">Age</th>
  </tr>
  <tr style="cursor: pointer;"><td class="tname">Jennifer</td><td class="tage">24</td></tr>
  <tr><td class="tname">Kate</td><td class="tage">36</td></tr>
  <tr><td class="tname">David</td><td class="tage">25</td></tr>
  <tr><td class="tname">Mark</td><td class="tage">40</td></tr>
</table>

물론 스타일을 CSS 파일에 넣고 클래스에 적용해야합니다.

---

CSS 사용

table tr:hover{cursor:pointer;} /* For all tables*/
table.sortable tr:hover{cursor:pointer;} /* only for this one*/

---

표준의 경우 위의 솔루션이 작동하지만 데이터 테이블을 사용하는 경우 기본 datatatables.css 설정을 재정의하고 사용자 정의 CSS에 다음 코드를 추가해야합니다. 아래 코드에서 row-select는 데이터 테이블에 추가 한 클래스입니다 html에 표시된대로.

table.row-select.dataTable tbody td
{
cursor: pointer;    
}

그리고 html은 다음과 같습니다.

<table datatable="" dt-options="dtOptions1" dt-columns="dtColumns1" class="table table-striped table-bordered table-hover row-select"  id="datatable"></table>

---

마우스가 a의 값을 넘을 때 커서 포인터를 손으로 변경하려면 어떻게해야합니까?

<TD class="Field" nowrap="true"> 

    <xsl:if test="KEY" >
    <xsl:attribute name="onclick">openWithTheseKeys("<xsl:value-of select='$' />","<xsl:value-of select='$' />","", true);</xsl:attribute>

    </xsl:if>
    <xsl:if test="KEY" >
    <xsl:attribute name="onclick">openWithTheseKeys("<xsl:value-of select='$' />","<xsl:value-of select='$' />","", true);</xsl:attribute>

    </xsl:if> 
<xsl:if test="KEY" >
    <xsl:attribute name="onclick">openWithTheseKeys("<xsl:value-of select='$' />","<xsl:value-of select='$' />","", true);</xsl:attribute>

    </xsl:if>               
    <xsl:value-of select="KEY" />
</TD>

참고 URL : https://stackoverflow.com/questions/9287693/change-cursor-to-hand-when-mouse-goes-over-a-row-in-table