WebTecNote

[jQuery]リンクに新しいウィンドウを開くアイコンを自動で追加する

殴り書きは続く…AutoExternalLinkのjQuery版。mootools版の同タイトル記事とほぼ同じです。
jQueryは馴染みが浅いのでもっさり感漂う残念なソースになってます。
自分がサイト組む時は外部リンクに大抵relかclass属性を付与するんで、relかclass持ちにだけ追加するライト版も書いてみた。
ダウンロードはスクリプトファイル2種と、jQuery版に修正したAutoExternalLinkプラグインファイルのセット。
元ソースからの入れ替えとかは自己責任でお願いします。

wordpressプラグイン本体の改造はこちらの記事で解説していますが、
zipに修正済みのプラグインファイルも突っ込んどいたので上書きでおk。動作デモはこのブログそのものです。

jQueryプラグインなので普通のサイトでも使えると思います。
varは1.2.6以上対応です多分。(1.2.6と1.3.2でしか確認してない)

Header

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery.jExternalLink.plugin.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
	$("#main").jExternalLink();
});
//]]>
</script>

上記指定で#main以下にあるaタグを全てチェックします。

Element.jExternalLink({options});

Elementは$(“#main”)みたいな書き方で。クラスやセレクタも使えます。

Optionは次の通り。mootools版と同じです

“jExternalLink” をダウンロード

WTN-jExternalLink.zip – 1250 回のダウンロード – 6.35 KB

簡易版プラグイン jExternalLink Lite

relとかclassとか、aタグに何らかの属性がある場合にのみ別窓アイコン追加する簡易版です。
上のプラグインでは、リンクの子要素が画像だった場合アイコンを追加しませんが、
こちらにはそのアクションは入れてありません。

使い方は上と同じ。

Option

[ダウンロードが見つかりません]

updates

モバイルバージョンを終了