tableで作った表組のどこを見ているかを明示するJavaScript「TargetTable jQuery Plugin」

大きな表組みを作ると今どこを見ているのかわからなくなってしまいます。
どこを見ているのか明示できるとユーザーフレンドリーかもしれません。
今回はTargetTable jQuery Pluginを利用して実現します。

使用方法
TargetTable jQuery PluginからjQuery.TargetTable.jsをjQueryからjquery.jsをダウンロードします。
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.targettable.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".class名").targetTable({
rowBgColor: "#50b05E", //横列背景
rowTextColor: "#000", //横列テキスト色
columnBgColor: "#ccc", //縦列背景
columnTextColor: "#000", //縦列テキスト色
targetBgColor: "#00cccc", //ホバーセルの背景色
targetTextColor: "#fff" //ホバーセルのテキスト色
});
});
</script>

上記のclassを振ったtableを記述すれば完成です。
<table class="targettable" width="600">
<tr>
<th>ID</th>
<th>Name</th>
<th>Surname</th>
<th>Another Column</th>
</tr>
<tr>
<td>1</td>
<td>Mark</td>
<td>Camilleri</td>
<td>#4122</td>
</tr>
</table>


tableで作った表組のどこを見ているかを明示するJavaScript「TargetTable jQuery Plugin」サンプル

sponsors

「tableで作った表組のどこを見ているかを明示するJavaScript「TargetTable jQuery Plugin」」をシェアする

記事作成:
記事URL:

TOP > > > tableで作った表組のどこを見ているかを明示するJavaScript「TargetTable jQuery Plugin」