[JS]a要素を内包するdiv要素全体をクリッカブルにするスクリプト -Div Linker

テキストリンクなどのa要素を内包するdiv要素の全部をクリック可能にするjQueryのプラグインを紹介します。

Div Linker
デモページ

[ad#ad-2]

Div Linkerの実装

実装は非常にシンプルです。

外部ファイル

「jquery.js」と当スクリプトを外部ファイルとして指定します。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="jquery.divlinker1.0.js"></script>

HTML

デモのようにテキストリンク（a要素）をdiv要素で内包します。

<div class="divlinker">
    <img src="image.jpg" width="151" height="130" />
    <br />
    <a href="http://www.google.com">Link text</a>
</div>

JavaScript

クリッカブルにする範囲をjQueryのセレクタで指定します。
例：.divlinker

$(document).ready(function(){
	$(".divlinker").divlinker();
});

[ad#ad-2]