Grid 變色功能

[yehlu]

Style_doctype.css

代碼: 選擇全部

.Row td { 
	font-size: 80%;
	padding: 4px;
	border-top: 1px solid #3d84cc; border-right: 1px solid #3d84cc;
	text-align: left;
	vertical-align: top;
	background-color: #f7f7f7; 
	color: #000000;
	}

要改為

代碼: 選擇全部

.Row td { 
	font-size: 80%;
	padding: 4px;
	border-top: 1px solid #3d84cc; border-right: 1px solid #3d84cc;
	text-align: left;
	vertical-align: top;
	}

另外再加上

代碼: 選擇全部

.oddtr
    {
    	background-color:#EFF1F1;
    }
.eventr
    {
    	background-color:#F8F8F8;
    }
.trover
    {
    	background-color: #0099CC;
    }
.trclick
    {
    	background-color: #00CCCC;
    } 

header
加上

代碼: 選擇全部

<script src="js/jquery-1.5.1.min.js"></script>
<script src="js/grid_tr.js"></script>

grid_tr.js 的內容

代碼: 選擇全部

var $j = jQuery.noConflict();
$j(function()
{
   $j(".Grid tr:even").addClass("eventr");;
   $j(".Grid tr:odd").addClass("oddtr");;
   $j(".Grid tr").mouseover(function() {$j(this).addClass("trover");}).mouseout(function() {$j(this).removeClass("trover");}).click(function() {$j(this).toggleClass("trclick");});
});