よろしくお願いします。
ラジオボタンで画像を切り替えるJavascriptを利用してはいかがでしょうか?
http://tksmtmt.s28.xrea.com/sample/change/
ラジオボタンで画像の切り替え
上記ページのJavascriptを用いて、画像のフレーム(枠)を切り替えるサンプルを作成してみました。
テーブルの背景はベースイメージ、前面の枠部分は内側を透過させたGIF画像としています。
見当違いでしたら申し訳ありません。
「プリクラのフレームのような感じで、人物画像に対してフレームを付与するイメージ」と理解して作りました。
人物の画像: ImageBackground.gif で指定 (じつは背景画像みたいなもの)
フレームの画像: Frame1.gif ~ Frame3.gif で、フレーム画像を指定
フレーム画像は透明領域を指定することで、人物画像に対して重ねた後あたかもフレームに入っているように見せるものです
<html><title>SAPMLE</title>
<body bgcolor=#E0E0E0>
<div style=’margin-left:100pt;margin-right:100pt;’>
<font size=+2 color=black>画像の選択</font>
<form name=”myForm”>
<div style=’background:#F0D0F0’>
<input type=”radio” name=”select” value=”Frame1” onclick=”targetImage.src=’./images/Frame1.gif’” />フレーム1
<input type=”radio” name=”select” value=”Frame2” onclick=”targetImage.src=’./images/Frame2.gif’” />フレーム2
<input type=”radio” name=”select” value=”Frame3” onclick=”targetImage.src=’./images/Frame3.gif’” />フレーム3
<input type=”radio” name=”select” value=”Blank” onclick=”targetImage.src=’./images/spacer.gif’” />なし
</div>
</form>
<table border=00 cellspacing=0 cellpadding=0 bgcolor=#666666>
<tbody><tr><td background=”./images/ImageBackground.gif”>
<IMG src=”./images/spacer.gif” name=”targetImage” width=120 height=160 border=0>
</td></tr>
</tbody></table>
<A href=”javascript:location.reload()”>リロード</a>
</div>
</body></html>
このようなものでいかがでしょう。
ありがとうございま。