マウスで行を上書きパリティ行の背景色が異なるcss+jquery Tableをハイライト表示
Html:
CSS:
Jquery:
別の余談を追加します.
$(document).ready(function(){});$(function(){});
@foreach (var item in Model)
{
}
Name
DisplayName
Description
Creator
CreateTime
UpdateTime
Url
@item.Name
@item.DisplayName
@item.Description
@item.Creator
@item.CreateTime
@item.UpdateTime
@item.Url
| | ElementList
CSS:
.tbl td {border: 1px solid #999999;cellpadding: 0px;cellspacing: 0px;}
.tbl span {color: #3399FF;}
.tbl th {border: 1px solid #999999;background-color: #CCCCCC;font-weight: bold;}
/*.tbl .even {background-color: #efeeef;}// */
.tbl .odd {background-color: #fff;}//
.tbl .over {background-color: #E6E5FF;}
Jquery:
$(document).ready(function () {
TblCss();
});
function TblCss() {
$(".tbl tbody>tr:odd").addClass("odd");
$(".tbl tbody>tr").mouseover(function () {
$(this).addClass("over");
});
$(".tbl tbody>tr").mouseout(function () {
$(this).removeClass("over");
});
}
別の余談を追加します.