ホーム >> sbzoom
sbzoom はシンプルな画像拡大スクリプトです。
注)sbzoom は当サイトで配布しているテンプレート専用のシンプルなスクリプトです。
画像の拡大スクリプトは高機能で、なめらかに画像を拡大表示するものがありますが
イメージタグにID属性を付けたり、特殊なタグでイメージタグを囲んだりと設置が面倒なのが現状です。
![]() |
sbzoomはクリックで拡大、再びクリックで拡大画像を閉じるという ← 画像をクリックで確認できます。 |
![]() |
画像自体にお手持ちのソフトウェアで |
![]() |
もちろん、クリックした時に同じ画像を表示しなくてもかまいません。 ←画像をクリックで確認できます。 |
(このページでは画像をクリックするとページが明るくなりますが、暗くすることもできます。詳細は↓)
設置方法
下記ボタンからお使いのテンプレートと同じものをクリックして素材をダウンロードして下さい。(zip形式)
![]()

ダウンロードしたデータを解凍後、フォルダの中身を全て「design」フォルダに入れます。
同じファイル名の素材があるため、上書きのアラートが出ますが、そのまま上書きして下さい。
次に、設置したいページのソースを開き、ソースを表示します。
上から5〜10行目あたりにある(お使いのソフトウェアによって異なる)
<script language="JavaScript" type="text/javascript" src="design/main_flash.js"></script>
のすぐ下に、下記1行を追加します。
<script language="JavaScript" type="text/javascript" src="design/sbzoom.js"></script>

スクリプトの設置はこれでおしまいです。
小さな画像 と 大きな画像 を準備して小さな画像をページに掲載して完成!
sbzoom を利用するには、元画像と拡大表示する画像2枚を準備します。
元画像の名前と拡大画像の名前を次のようにし、元画像をページに配置すれば動作します。

ちょっとカスタマイズして自分らしく
背景を暗くしたい場合は、「design」 フォルダに入っている 「back.png」 を消去して「back1.png」を「back.png」と
名前を変更して下さい。
お手持ちのソフトウェアなどで、透過情報を持つPNG画像を「design」フォルダに「back.png」で保存すれば
背景がそちらの画像に変わります。
また、拡大表示した際に画面上部に表示される
画像は「design」フォルダにある
「button.gif」という画像です。
自分の好みでボタンを作り、同じ名前で上書き保存すれば、その画像が表示されるようになります。
ページの上部へ










