重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら＞

電子書籍の厳選無料作品が豊富！

プルダウンからの背景色変更

解決済

  • 質問者：noname#7922
  • 質問日時：
  • 回答数：3件

題名の通りなのですが、プルダウンさせてその中の選択項目から色を指定したら、背景がかわるというものをつくりたいのですが、可能なことなのでしょうか？
もしわかればやり方を教えてください。困ってます。。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (3件)

No.3ベストアンサー

  • 回答者： godakaz
  • 回答日時：

<html>


<head>
<script language="javascript">
<!--
function s1_chg(val){
var i=document.f.s1.options[val].value;
document.body.style.backgroundImage='url('+i+')';
}
function s2_chg(val){
var i=document.f.s2.options[val].value;
document.body.style.backgroundColor=i;
}
//-->
</script>
</head>
<body style="background-image:url(''); background-color:#ffffff;">
<form name="f" id="f">
<select id="s1" name="s1" onChange="s1_chg(this.selectedIndex);">
<option value="" selected>背景画像を選択してください。</option>
<option value="a.gif">A</option>
<option value="b.gif">B</option>
<option value="c.gif">C</option>
</select>
<br>
※背景画像を表示すると、背景色が表示されません。<br>
※背景画像を透過GIFにすると、画像の背景部分に背景色が表示されます。
<hr>
<select id="s2" name="s2" onChange="s2_chg(this.selectedIndex);">
<option value="" selected>背景色を選択してください。</option>
<option value="#ffcccc">R</option>
<option value="#ccffcc">G</option>
<option value="#ccccff"">B</option>
</select>
<br>
※背景画像が表示されているときは、背景色が表示されません。
</form>
</body>
</html>
    • good
    • 0
    • 件
通報する
この回答へのお礼

大変参考になりました。ありがとうございました

通報する
お礼日時：2002/12/18 13:29

No.2

  • 回答者： ittochan
  • 回答日時：

背景色を変えるのね。



<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT LANGUAGE=javascript>
<!--
function select1_onchange() {
var s = select1.options(select1.selectedIndex).value;
if (s == ""){return;}
document.bgColor = s;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
これはどうでしょう？<br>
InternetExplorerでしか動かないでしょう<P>
<SELECT id=select1 style="WIDTH: 200px" name=select1 LANGUAGE=javascript onchange="return select1_onchange()">
<OPTION value="" selected>色を選んでね</OPTION>
<OPTION value=black>黒</OPTION>
<OPTION value=red>赤</OPTION>
</SELECT></P>
</BODY>
</HTML>
    • good
    • 0
    • 件
通報する
この回答へのお礼

だいたいやり方などがわかりました。本当にありがとうございます。私のホームページで活用したいと思います

通報する
お礼日時：2002/12/18 13:30

No.1

  • 回答者： ittochan
  • 回答日時：

<HTML>


<HEAD>
<TITLE></TITLE>
<SCRIPT LANGUAGE=javascript>
<!--
function select1_onchange() {
img.innerHTML = "<IMG style='Z-INDEX: -1; LEFT: 0px; POSITION: absolute; TOP: 0px' src='" + select1.options(select1.selectedIndex).value + "'>";
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<P id=img>
これはどうでしょう？<br>
InternetExplorerでしか動かないでしょう<P>
<SELECT id=select1 style="WIDTH: 200px" name=select1 LANGUAGE=javascript onchange="return select1_onchange()">
<OPTION value="" selected>画像を選んでね</OPTION>
<OPTION value=sample1.jpg>sample1</OPTION>
<OPTION value=sample2.jpg>sample2</OPTION>
</SELECT></P>
</BODY>
</HTML>
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

このQ&Aを見た人がよく見るQ&A

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報