画像の縮小表示→オリジナルサイズ表示 

春木屋さんの外部スクリプトをお借りしています。

特徴
・1枚の画像で縮小・実サイズの両方を表示できます。
・拡大の方法を3種類から選べます。1ページ内に併用も可能です。

１．元ページにオリジナルサイズの画像を表示する。
２．マウスダウンの間だけ、その場で拡大表示する。
３．オリジナル画像のサイズに合わせて別窓を開いて表示する。

・ユーザはimg要素に、予約classNameを指定するだけでOK。それぞれの拡大方法は自動で判断します。
・ｊsファイルを編集することで、スタイルシートの記述方法（px, pt, cm, em, % など）を使い縮小サイズを指定できます。
・FC2管理画面から予約className、またはサブクラスにユーザ独自の装飾（枠線、回り込み など）も行えます。

動作は３種類
�．螢鵐�のタグを省略して、FC2のデフォルトと同じ動作（画像のURIに移動）をします。戻るにはブラウザの戻るボタンを使用してください。
<img src="URI" class="js_scale" alt="" title="" />

�▲泪Ε好椒織鵑魏，靴討い覺屬世吋�リジナルサイズで画像を表示します。離すと縮小サイズに復帰。
<img src="URI" _fcksavedurl=""URI"" class="js_expand" alt="" title="" />
 写真が大きすぎると切れて表示されます。ここでは大きくても４００×３００にしています。

��オリジナルサイズの別窓が開いて画像を表示します。窓（画像本体）をクリックで閉じます。
<img src="URI" _fcksavedurl=""URI"" class="js_popup" alt="" title="" />
 大きな写真の時に使っています。ただしアップロードできるファイルは、250KBまでなのでそれ以上の時は事前にファイルサイズを縮小してアップします。閉じ方も簡単で重宝します。

詳しい説明は上記春木屋さんのリンクにて

トラックバック

この記事のトラックバックURL
http://monjya.blog44.fc2.com/tb.php/54-4bf70a77