このページの本文へ

ステーキ丼をJavaScriptで美味しく拡大 (2/5)

2008年09月06日 04時00分更新

文●古籏一浩、ASCII.jp

  • この記事をはてなブックマークに追加
本文印刷
I Want One Of Those

「TJPzoom」は、作者tjpさんのWebサイトからダウンロードできます

Adobe Spry

[1] TJPzoomのページの下にある「Download the tutorial」の文字をクリック

Adobe Spry

[2] ダウンロードしたZIPファイルの中にある「tjpzoom.js」が今回使用するファイルです

その名もズバリ「TJPzoom」がカンタン便利


 画像を拡大表示するJavaScriptライブラリはいくつかありますが、今回は「TJPzoomライブラリ」を使いましょう。TJPzoomなら、I Want Of Thoseのような画像ズーム機能をわずか数分で手軽に実装できます。

 ただ、このTJPzoomライブラリはInternet Explorer(以下IE)で動かした場合に若干の不具合があります。IE向けの不具合対策は最後に紹介するとして、とりあえずそのほかのブラウザーで表示されるようにしてみましょう。


まずはライブラリのダウンロードから


 さっそくTJPzoomを使用するための準備から始めます。以下のURLからTJPzoomをダウンロードします(2008年9月時点でのバージョンは3)。

http://valid.tjp.hu/tjpzoom/


 ページの下の方に、「Download the tutorial」というリンク文字があります。ダウンロードを開始するためリンクをクリックしましょう。 [1]

 ダウンロードしたファイル(ZIP形式)を解凍すると(環境によっては自動的に解凍されることがあります)、いくつかのファイルやフォルダがありますが、今回は「tjpzoom.js」1つだけを使用します。 [2]

 これで準備は完了です。次ページで実際のサイトに組み込んでみましょう。

この連載の記事

一覧へ

この記事の編集者は以下の記事をオススメしています