MovableType・テンプレート・ブログカスタマイズの小粋なテクニック満載!

 


« 前のページ | HOME | 次のページ »

2006年07月12日

» MT3.2/3.3 画像のポップアップウインドウをカスタマイズ

Movable TypeではJavaScriptを利用した画像のポップアップ表示が可能ですが、
デフォルトではウインドウのリサイズやスクロールが無効になっている為、
ディスプレイサイズより大きい画像の場合、その全てを参照することが出来ません。
そこで今回は画像のポップアップウインドウをカスタマイズする方法を
紹介したいと思います。

詳しいカスタマイズ方法は小粋空間のほうで紹介していますので
こちらも参考にして下さい。

>画像のポップアップウィンドウをカスタマイズする(小粋空間)

カスタマイズ方法は続きを読むからどうぞ。

ポップアップウィンドウのカスタマイズ方法

ポップアップウインドウのリサイズ、スクロールを有効にするには

MTのディレクトリ/lib/MT/App/CMS.pm

をカスタマイズします。
MT3.2では3600行目辺り、MT3.3では4700行目辺りです。
画面にスクロールバーを表示する設定「scrollbars=no」と、
リサイズを可能にする設定「resizable=no」を、
それぞれ「=yes」に書き換えます。

<a href="$url" onclick="window.open('$url','popup','width=$width,height=$height,scrollbars=yes,resizable=yes,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false">$link</a>

また、スクロールバーを表示した場合、そのままだと
画像が隠れてしまうので、横幅と高さを調整します。
上記の行の少し上に「$width += xx;」「$height += xx;」を追加します。

} $width += 17;
$height += 17;
my $link = $thumb ? qq(<img src="$thumb" width="$thumb_width" height="$thumb_height" alt="" />) : q{<MT_TRANS phrase="View image">};
return $app->translate_templatized(<<HTML);
<a href="$url" onclick="window.open('$url','popup','width=$width,height=$height,scrollbars=yes,resizable=yes,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false">$link</a>

ただし、このカスタマイズ方法はアップグレードの度に
修正が必要なので要注意です。


★ この記事が参考になりましたら投票お願いします。


» 関連記事




» トラックバックURL

トラックバックURL: http://atoria.sakura.ne.jp/mt/mt-tb.cgi/192





» コメントの投稿