FBEを組み込みたいHTMLソース(xxx.html)を開き、適所へopenFBE関数(JavaScript)を記述します。

手順は以下の2つとなります。

  1. 外部JavaScriptファイル(FBEを制御する為のopenFBE関数等が含まれます)読み込み定義を記述して下さい。
  2. FBEを組み込みたい個所へopenFBE関数(JavaScript)を記述して下さい。

※JavaScriptファイル郡(flash.js,flash_check.js)は配布ファイル中の「jsフォルダ」に格納されています。

STEP 1

外部JavaScriptファイルの組込み

下記コードをHTMLソース先頭の<head>から</head>の間に記述(コピー&ペースト)します。

<!-- ここから外部JavaScriptファイルの読込定義 --> 
<script type="text/javascript" src="flash_check.js"></script>
<script type="text/javascript" src="flash.js"></script>
<!-- ここまで外部JavaScriptファイルの読込定義 -->

配布ファイル中に含まれるflash_check.jsとflash.js2つの外部JavaScriptファイルを利用するための宣言部となります。

実際に組み込む際はflash_check.jsとflash.jsのパス指定は適時修正して下さい。

補足説明

flash_check.js → フラッシュバージョンチェックモジュール

flash.js → FBE組込関数モジュール(openFBE関数含む)

STEP 2

openFBE関数記述

※FBEを組み込みたい箇所へ、下記コードをHTMLソースに記述(コピー&ペースト)します。
後述するパラメータ説明を参考に、画像サイズ等のパラメータを修正して下さい。

<script>~</script>までの間にFBE組込関数(openFBE)を記述して下さい。
<noscript>~</noscript>までの間にJavaScriptが使用できない環境で表示する代替イメージを定義して下さい。

<!-- ここからFBE組込定義 -->
<script type="text/javascript">
<!--
openFBE('misfbe.swf','btn_normal.jpg',640,400,'config.xml','#ffffff');
//-->
</script>
<!-- ここまでFBE組込定義 --> 

<!-- ここからJavaScript無効時に表示する代替イメージ -->
<noscript>
<div>
<img src="btn_normal.jpg" width="640" height="400" alt="Flash Button Engine 代替イメージ elz.jp">
<p>JavaScriptをオンにして下さい</p>
</div>
</noscript>
<!-- ここまでJavaScript無効時に表示する代替イメージ -->

openFBE関数パラメータ

openFBE('FBE本体ファイル名','代替イメージ',横幅,高さ,'定義ファイル名','背景色')

FBE本体ファイル名
FBE本体ファイル名を指定して下さい。
通常は「misfbe.swf」となります。
HTMLファイルと異なる場所にmisfbe.swfが存在する場合は「../misfbe.swf」等の相対指定も可能です。
※省略不可です。 ※シングルクォーテーションで囲んで指定して下さい。
代替イメージ
FBEはFlash Player バージョン7以上がインストールされている環境で動作します。
JavaScriptは使用可能であるが、バージョン7未満のプレイヤーの場合「代替イメージ」で指定された画像が表示されます。
※省略不可です。
※シングルクォーテーションで囲んで指定して下さい。
横幅
表示枠横幅をドット単位で指定します。
※省略不可です。
※シングルクォーテーションは不要です。
高さ
表示枠高さをドット単位で指定します。
※省略不可です。
※シングルクォーテーションは不要です。
定義ファイル名
定義ファイル名を指定して下さい。
通常は「xxx.xml」となります。
HTMLファイルと異なる場所に定義ファイルが存在する場合は「../xxx.xml」等の相対指定も可能です。

※省略不可です。
※シングルクォーテーションで囲んで指定して下さい。

背景色
背景色を16進数で指定します。
「#ffffff」と指定した場合は「白」になります。
「#ff0000」と指定した場合は「赤」になります。
省略時は透明扱いになりますがパフォーマンスが落ちるので必要でない限り背景色を指定することをお勧めします。
※シングルクォーテーションで囲んで指定して下さい。

Flash Player 判定について

flash_check.jsは古いFlash Playerがインストールさているか?を検出する為のJavaScriptモジュールです。

  • Flash Player 7以上がインストールさていることをチェックするjs/flash_check.js
  • Flash Player 8以上がインストールさていることをチェックするjs/flash8/flash_check.js

FBEで利用する機能に合わせてflash_check.jsをお選び下さい。