マウスカーソルを画像の上に乗せたときに表示する文字をこのソフトではtitleというのだが、説明が長いときには改行をしたかったのだ。
改行の他、着色やイタリック、ボールド、フォントの指定、さらに背景(吹き出し)のデザインもできることが分かった。
全体の背景も透過色にできるので、本体のHTMLで画像を指定してそれを生かすこともできる。
まず、HTML内の記述に太字の1行を加える。
つまり、{wmode: "transparent"}として、背景の透過色指定をする。
<script type="text/javascript">
swfobject.embedSWF("../flash/Carousel.swf", // flash file
"mySlideShowDiv", // div id
"650", "500", // width and height
"9.0.0", // flash palyer version
false, // autoinstall
{xmlfile:"flshow2_icons.xml", loaderColor:"#000066"}, // flashvars
{wmode: "transparent"},
{bgcolor: "#ffffff"}, // parameter
{}); // attributes
</script>
次に、xmlファイルの記述の追加。(太字の部分)
<options>
<titles>
<style>
body { font-size: 14px; <!-- pixel only -->
font-family: Georgia, _serif; <!-- as standard CSS -->
color: #FFCC66; <!-- as standard CSS -->
}
.red { color: #FF0000; }
</style>
ここまで書いたら、とりあえず</style>で閉じる。
吹き出し部分をbodyに見立て、スタイルシートと同じ記述をすることで、フォントサイズ、フォントタイプ、フォント色を一括して行える。さらに、クラスやIDの指定もできる。(上の例ではidのみ)
こちらは、吹き出しの位置。
<position>above right</position> <!-- [above, below] [left,center,right] -->
吹き出しの背景指定は以下の通り。
<background>../img/mytitlebg.png</background> - <!-- image url -->
<scale9>14 14 14 14</scale9> - <!-- [0,1000] pixels -->
<padding>8 12 8 12</padding> - <!-- [-1000,1000] pixels -->
</titles>
(中略:元の記述内容)
</options>
そのあとに、個々の画像ファイルの指定。
<photo>
<href>../index.html</href><target>_blank</target>
<title>キユーピー</title>
<src>../img/vegetables/kewpie150.gif</src>
</photo>
<photo>
<href>../img/vegetables/tomato150.gif</href><target>_blank</target>
<title>トマト or a <span class="red">tomato</span>, isn't it? </title>
<src>../img/vegetables/tomato150.gif</src>
</photo>
(以下、略)
なお、トマトの、<span class="red">tomato</span> に注意が必要。idではなくclassとなる。
これで、上書き、アップロード。
非常に興味深いのは、吹き出しの画像を指定するが、文字が入りきれないときには、自動的に拡大する仕組みになっていること。しかも、単純に拡大するのでは余白が不自然になったり、縁取りの幅が変わってしまうのだが、どうやらscale 9 gridという画像処理の方法があるようだ。ファイル内の指定では、
<scale9>14 14 14 14</scale9>
の部分にちょっとだけ出てくる。
これが吹き出しの本来の背景画像なのだが、

文字数や行数に応じてこんなふうに表示される。

ただし、
<scale9>14 14 14 14</scale9>
の数値を変えてみたが表示に変化はなし。
ためしに、違う画像を用意してみた。

実際に使ってみると・・・
(備考:<padding>18 22 18 22</padding>に設定)


形のあるものは、あまり使えないことが分かった。
※flShowの利用
※flShowの利用〜追記
※野菜の画像は、フリー・画像サイトhttp://clipart.myds.jp/vegetables/のものを使用させていただきました。
http://d.hatena.ne.jp/moetsukiro/20090311/1236731302