Измените курсор на руку, когда мышь проходит по строке в таблице

Question

Измените курсор на руку, когда мышь проходит по строке в таблице

как я могу изменить указатель курсора на руку, когда моя мышь проходит через <tr> на <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>

541 10

html css cursor

10 ответов:

Comments

Ничего не найдено.

dangerChihuahua007 · Accepted Answer · 2014-11-14 14:05:55

вы могли бы сделать это без JavaScript на самом деле.
.sortable tr {
    cursor: pointer;
}

Ivan · Accepted Answer · 2015-12-12 20:27:06

Я искал bootstrap стили немного и нашел это:
[role=button]{cursor:pointer}
Так что я предполагаю, что вы можете получить то, что вы хотите с:
<span role="button">hi</span>

Ira Herman · Accepted Answer · 2012-06-14 20:58:32

самый простой способ, который я нашел, это добавить
style="cursor: pointer;"
ваши теги.

James Montagne · Accepted Answer · 2012-02-15 06:03:33

добавить cursor: pointer для вашего css.

23

2012-02-15 06:03:33

xackobo · Accepted Answer · 2015-11-27 17:48:36

Я добавил Это в моем стиле.css для управления параметрами курсора:
.cursor-pointer{cursor: pointer;}
.cursor-croshair{cursor: crosshair;}
.cursor-eresize{cursor: e-resize;}
.cursor-move{cursor: move;}

Chetan · Accepted Answer · 2012-02-15 06:03:44

стиль cursor: pointer; в CSS для элемента, который вы хотите, чтобы курсор изменился.

в вашем случае, вы бы использовали (в вашем .css file):
.sortable {
    cursor: pointer;
}

UbiQue · Accepted Answer · 2014-03-18 14:47:11

для совместимости с IE
.sortable:hover {
    cursor: pointer;
    cursor: hand;
}
но помните, что IE :hover псевдокласс только с <a> элемент.

EverPresent · Accepted Answer · 2012-02-15 06:04:45

используйте 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-файл и применить его к классу.

The Alpha · Accepted Answer · 2012-02-15 06:10:29

С помощью css

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

Renu · Accepted Answer · 2016-04-14 16:30:21

только для стандарта вышеуказанные решения работают, но если вы используете datatables, вы должны переопределить datatatables по умолчанию.настройки css и добавьте следующий код в пользовательский css, в коде ниже строки-выберите класс, который я добавил в datatables, как показано в 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>