[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]

sponsors

top of page

©2018 coliss