div要素もリンクにするjavascript「jquery.biggerlink」

リンクと言えばaタグですが、ボックス単位の大きなdiv要素もリンクにしたくなります。
jquery.biggerlinkはそんな我が儘を叶えてくれるjavasrciptです。

sponsors

使用方法

jquery.biggerlinkからjquery.biggerlink.jsを、jQueryからjquery.js(v1.2.1)をダウンロードします。
<script src="http://yourdomain/jquery.js" type="text/javascript"></script>
<script src="http://yourdomain/jquery.biggerlink.js" type="text/javascript"></script>
<script type="text/javascript">
	$(function(){
		$('#id名 div').biggerlink();
	});
</script>
あとはid名でくくった要素の中にdivを書き込めば完成です。
<div id="id名">
	<div>
		<a href="リンク先URI">リンクテキスト</a>
		<p>コンテンツ</p>
	</div>
</div>
なおリンクは以下のようなCSSで指定します。
.hover {
	border-color: #aaf;
	cursor: pointer;
	background-color: #cdF;
	}
.hover a:link {
	color: #CC3333;
	}
.hover a:visited {
	color: #CC3333;
	}

サンプル

Javascriptサンプルページ一覧
skuare.net