ドロップダウンで選択した画像を表示したい

[matu41]

はじめまして、昨日から採用を検討し色々試しているところです。

ドロップダウンでリストを作り、
そのリストに対応した画像を指定部分に表示させたいのですが、
どのようにしたら良いでしょうか。

アドバイスをよろしくお願い致します。

[webmaster]

　matu41さん、ご質問ありがとうございます。

コード: 全て選択

<data name="color" type="menu" caption="色">
  <menuitem id="red">赤</menuitem>
  <menuitem id="blue">青</menuitem>
  <menuitem id="green">緑</menuitem>
</data>

　のようなメニュー項目をスキーマに作り、

コード: 全て選択

<span style="color:{color}">タイトル文字</span>

　のように書くと、{color}の部分に、メニュー項目の「color」のidの値が
出力されます。

　インラインCSSは避けたい場合には、

コード: 全て選択

<span class="{color}">タイトル文字</span>

　としておき、CSS側で、

コード: 全て選択

span.red { color:red; }
span.blue { color:blue; }
span.green { color:green; }

　と定義しておく方法も良いかと思います。
　簡単な例ですが、何かのご参考になりましたら幸いです。

　ご不明な点は再度ご指摘下さい。

[matu41]

お返事ありがとうございました。

私の理解不足で、申し訳ないのですが、もう一度お願い致します。

ドロップダウンのリストで、

　四角
　マル
　三角

と作り、

四角が選択された場合、別に用意していた　■の画像を表示させたいのです。
（四角→■　　マル→○　　三角→▲　の画像をそれぞれ）

画像のURLをどこで、どのように指定をしたら良いのかが分かりません。
アドバイスを宜しくお願い致します。

[webmaster]

　matu41さんお返事ありがとうございます。

　すいません、なぜか「色を変えたい」というご要望だと早合点してしまいました。m(__;)m

コード: 全て選択

<data name="image1" type="menu" caption="画像">
  <menuitem id="circle">丸</menuitem>
  <menuitem id="square">四角</menuitem>
  <menuitem id="triangle">三角</menuitem>
</data>

　上記のスキーマで、

コード: 全て選択

<xsl:if test="image1='circle'"><img src="circle.gif" alt="丸" /></xsl:if>
<xsl:if test="image1='square'"><img src="square.gif" alt="四角" /></xsl:if>
<xsl:if test="image1='triangle'"><img src="triangle.gif" alt="三角" /></xsl:if>

　というようなデザイン定義になるかと思います。
　リファレンスマニュアルの「５．５．７ メニュー項目を表示する。」に、
関連する情報がございますので、併せてご覧頂くと参考になるかと思います。

　ご不明な点はお手数ですが再度ご指摘頂ければ幸いです。

[matu41]

アドバイスありがとうございました。
やっと画像の表示ができました！

また、質問させて頂くことがあったら宜しくお願い致します。