2011.01.20

このサンプルは非常にシンプルな構成です。HTMLはCSS(スタイルシート)等での装飾無し。スライドショー用の定義ファイル(*.xml)も数種類のパラメータの指定のみと必要最低限の情報で作られています。

別記事3分でフラッシュスライドショーを作成で紹介しているものとほぼ同等のものです。当ページからサンプル(ZIP形式)をダウンロードして適当なフォルダに展開してください。そしてsample.htmlをブラウザで表示させて下さい。3枚の花の写真のスライドーショーが動作したと思います。その後は画像ファイルをお手持ちの画像(できれば小さめ640x400程度)と差し替えて再度sample.htmlを確認して下さい。流用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>
    <!-- エフェクト種別 31:フェードイン -->
    <effect_type>31</effect_type>
    <!-- エフェクト時間 1秒 -->
    <effect_time>10</effect_time>
    <!-- 停止時間指定 3秒 -->
    <stop_time>30</stop_time>
</common>


</pagedata>