2012.09.28

このサンプルはスローテンポなズームエフェクトとBGM再生を組み合わせています。シンプルなHTMLはCSS(スタイルシート)等での装飾無しです。

当ページからサンプル(ZIP形式)をダウンロードして適当なフォルダに展開してください。そしてsample.htmlをブラウザで表示させて下さい。画像ファイルをお手持ちの画像(できれば小さめ640x400程度)と差し替えてお楽しみください。もちろん流用OKです。

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

001.jpg
http://elz.jp/media/images/001.
002.jpg
http://elz.jp/media/images/002.
003.jpg
http://elz.jp/media/images/003.
 
<?xml version="1.0" encoding="UTF-8" ?>
<pagedata>

<common>
    <copyright>elz.jp</copyright>
    <stage_width>640</stage_width>
    <stage_height>400</stage_height>
    <prefix>http://elz.jp/media/images/</prefix>
    <!-- 画像枚数指定。images_001 jpg から images_003 jpgまで -->
    <image_max>3</image_max>
    <!-- エフェクト種別  -->
    <effect_type>in,out</effect_type>
    <!-- エフェクト時間 9秒 -->
    <effect_time>90</effect_time>
    <!-- 停止時間指定 0秒 -->
    <stop_time>0</stop_time>
    <!-- ベースモード中心点基準 -->
    <base_mode>5</base_mode>
    <!-- アラインモード 中央寄せ -->
    <align_mode>5</align_mode>
    <!-- ズームモード オリジナルサイズ -->
    <zoom_mode>0</zoom_mode>
    <!-- BGM指定 -->
    <bgm_url>media/bgm/elz_bgm001.mp3</bgm_url>
</common>

<effect>
    <!-- 登場 100%から125%へ拡大 -->
    <in  xs="1,125,100" ys="1,125,100" alpha="121,100,0" x="0,320"  y="0,200" />
    <!-- 退場 125%から150%へ拡大 -->
    <out xs="1,150"     ys="1,150"     />
</effect>

</pagedata>