Link Thumnailの使い方

リンクにマウスを当てるとリンク先のサムネイルを表示するAjaxライブラリをご紹介します。

»Link Thumbnail

とても簡単に導入することができます。

ダウンロード/解凍

arc90 lab : tools : Link Thumbnail

ダウンロードしたファイルを解凍します。linkthumbフォルダのarc90_linkthumb.js,linkpic_shadow.gifをアップロードします。

スクリプトファイルの読み込み

<script language="JavaScript" type="Text/JavaScript" src="○○○"></script>
<style type="text/css" media="screen">.arc90_linkpic { display: none; position: absolute; left: 0; top: 1.5em; } .arc90_linkpicIMG { padding: 0 4px 4px 0; background: #FFF url(/tools/c/images/linkpic_shadow.gif) no-repeat bottom right; }</style>

○○○はarc90_linkthumb.jsへのパス。

linkthumbクラスを設定

サムネイルを表示したいリンク要素のクラス属性にlinkthumbを指定します。

関連記事
»Javascriptライブラリの使い方
»Javascript/Ajaxライブラリー一覧
»Lightbox2.0の使い方
»ThickBoxの使い方
»Javascriptの角丸ライブラリ
»Prototype Window Classの使い方
»Link Thumnailの使い方