[JavaScript] リンクに自動でアイコンを付加する
リンクに自動でアイコンを付加するライブラリを作成した。
丁度よいので、このブログの記事ページに使ってみた。
使い方
ZIPファイルを解凍後、JSファイルとアイコン画像を任意のディレクトリに配置し、本機能を実装したいhtmlでJSファイルを読み込む。
<script type="text/javascript" src="js/addIcon2Links.js"></script>
次に、JSファイルを開き、各設定項目をサイトに合わせて編集する。
//-----------------------------------------
// 設定値
//-----------------------------------------
conf : {
// アイコン配置ディレクトリ(ルート・絶対・相対パスで指定可能)
imageDir : './images/',
// imageDir : '/common/images/',
// imageDir : 'http://www.sample.com/common/images/',
// アイコンを付加する拡張子
extension : [
// [ '拡張子', 'アイコンとして表示する画像ファイル名', '任意のクラス名' ],
[ '.pdf', 'ico_pdf.png', 'addIconPdf' ],
[ '.xls', 'ico_xls.png', 'addIconXls' ],
[ '.doc', 'ico_doc.png', 'addIconDoc' ],
[ '.ppt', 'ico_ppt.png', 'addIconPpt' ],
[ '.zip', 'ico_zip.png', 'addIconZip' ],
[ '.lzh', 'ico_zip.png', 'addIconZip' ],
[ '.cab', 'ico_zip.png', 'addIconZip' ],
[ '.txt', 'ico_txt.png', 'addIconTxt' ]
],
// 上記以外でアイコンを付加するリンク(true:付加する/false:付加しない)
externalFlag : [ true, 'ico_external.png', 'addIconExternal' ], // 外部サイトへのリンク
mailFlag : [ true, 'ico_mail.png', 'addIconMail' ], // mailto
httpFlag : [ true, 'ico_http.png', 'addIconHttp' ], // httpへのリンク(httpsページ内のみ有効)
httpsFlag : [ true, 'ico_https.png', 'addIconHttps' ], // httpsへのリンク(httpページ内のみ有効)
blankFlag : [ true, 'ico_blank.png', 'addIconBlank' ], // 別ウィンドウ
// httpのドメイン(httpsとドメインが変わる場合は文字列で設定)
httpDomain : location.hostname,
// httpDomain : 'mashimonator.weblike.jp',
// httpsのドメイン(httpとドメインが変わる場合は文字列で設定)
httpsDomain : location.hostname,
// httpsDomain : 'secure104.chicappa.jp',
// 該当ページのURL(変更不可)
url : location.href
},
ちなみに、画像リンクの場合はアイコンが付加されないようにしている。
トラックバックURL
http://mashimonator.weblike.jp/mt/mt-tb.cgi/102
コメント投稿フォーム