2011.01.21

200x112pxサイズ(16:9 ワイドテレビ比率)のフラッシュ表示枠でリンクバナーを作成しました。

Paint Shop Proで円形サムネイル画像を準備し、上下に2枚に分割したものを利用しています。円形サムネイル画像の製作方法は極座標効果での円形サムネイル画像作成参考にして下さい。2枚の半円画像を回転させながら若干拡大縮小させています。

Fireworksで作成した透過PNGの角丸フレームをオリジナルフレームプラグインとして組み込んでいます。透過部分に階調をつけることで表示画像にも動的に明暗を表現することができます。

当サンプルの定義ファイル

free_download001.jpg
http://elz.jp/media/fpe/free/free_download001.
free_download002.jpg
http://elz.jp/media/fpe/free/free_download002.
frame_200x112c.png
http://elz.jp/media/fpe/free/frame_200x112c.
 
<?xml version="1.0" encoding="UTF-8" ?>
<pagedata>

<common>
    <stage_width>200</stage_width>
    <stage_height>112</stage_height>
    <prefix>http://elz.jp/media/fpe/free/free_download</prefix>
    <link_url>http://elz.jp/contents/sample/</link_url>
    <copyright>elz.jp</copyright>
    <!-- 広告用バナーを左に寄せる -->
    <banner_align>4</banner_align>
    <!-- 画像2枚のスライドショー(ループ) -->
    <image_max>2</image_max>
    <effect_type>in,out</effect_type>
    <!-- エフェクト時間 3秒 -->
    <effect_time>30</effect_time>
    <!-- 停止しない -->
    <stop_time>0</stop_time>
    <!-- 上寄せ -->
    <align_mode>8</align_mode>
    <base_mode>8</base_mode>
    <!-- オリジナルサイズモード -->
    <zoom_mode>0</zoom_mode>
    <!-- オリジナル角丸フレームPNG画像 -->
    <frame_url>http://elz.jp/media/fpe/free/frame_200x112c.png</frame_url>
</common>

<effect>
    <in  rot="1,360,180" xs="302,25,100" ys="302,25,100" x="0,100" y="0,-20" />
    <out rot="1,180"      xs="302,25,100" ys="302,25,100" />
</effect>

</pagedata>