[JS]img要素の属性で画像をLightbox風に拡大するスクリプト -Fullsize

img要素の属性「longdesc」「title」を元に、Lightbox風にスムーズなアニメーションで画像を拡大するスクリプト「Fullsize」を紹介します。

Fullsize A New IMG Tag Attribute

「longdesc」は本来、画像の（詳細で長い）説明ページへのリンクを記述する属性です。
作者は、img要素に大きい画像を指定する属性「fullsize」を望んでおり、その代わり（？）として「longdesc」を使用したとのことです。

属性を使用しているため、img要素にリンク（a）を設置できる仕様は大きなポイントだと思います。

スクリプトの「longdesc」「title」を変更したい場合には、「jquery.fullsize.js」のL.71, 75, 76を変更すればよさそうです。

対応ブラウザはIE6/7/8, Fx, Op, Safari, Chromeとなっており、拡大画像の枠に透過PNGが使用されているためIE6用にはDD BelatedPNGなどを併用する必要があります。

Fullsizeの設置

拡大する画像のHTMLの基本書式は、「longdesc」に拡大画像を指定します。
title属性はオプションです。

枠やローディング用の画像を適切な場所にアップロードし、js, cssファイルを外部ファイルで指定し、下記の記述をすると準備は完了です。

FullsizeはjQueryのプラグインのため、実装にはjquery.jsが必要です。