今回は応用ワザです。
写真のサムネイルを指定すると、たぶんほとんどのブログで別の新しいブラウザウインドウが立ち上がると思います。これは写真があまり大きくないときはちょっと見栄えがよくありません。
ですので、Javascriptを使って写真の大きさに合わせたウインドウを開いてみます。
まず、写真をサムネイル付きでアップロードします。すると例えばこんなコードが書かれると思います。
<a href="http://***.ne.jp/****/****/image1.jpg" target="_blank"><img src="http://***.ne.jp/****/****/image1sam.jpg" width="150" height="100"></a>
このままですと大きな新しいウインドウがまんま開かれまので、a href以下をこんなふうに書き換えます。
<a href="javascript:;" onClick="window.open('http://***.ne.jp/****/****/image1sam.jpg','',
'width=440,height=300,toolbar=no,menubar=no,status=no');"><img src="http://***.ne.jp/****/****/image1sam.jpg" width="150" height="100" border="0" align="" alt="135_01.jpg" /></a>
widthとheight(グリーンの部分)は元の写真の大きさですが、やや大きく+20くらいにするときれいにおさまります。
写真だけを見せるので余計な飾りがあると邪魔くさいと思えば、
toolbar=no,menubar=no,status=no(イエローの部分)
のようにすべてをnoに指定します。
このソースは改行してあるように見えますが、スクリプトは改行を入れると無効になりますので、onClick="〜"の部分は一気に書いてください。
またonClick="〜"の中は""(ダブルクォート)を使わず、''(シングルクォート)で囲うようにしてください。
サンプルはこんな感じになります。
※本文中に書けるjavascriptは限られていますし、複雑なスクリプトはブラウザによっては動作しないことがありますので、この程度の簡単なものにしておきましょう。
