• ベストアンサー

リンク先にまで色変更されたままにしたいのですが。

以下のようなソースを入れ背景色を変更できるようにしました。 (フレーム1にこのソースを入れフレーム2を変更できるようにしました。) ですが、色変更してもHP内の別のページに行ってしまうとまた、設定する前の状態に戻ってしまいます。 リンク先まで色変更を保ったままにしたいのですがどうすればいいでしょうか?全然わかりません。知ってる方いましたら教えてくださいお願いします。プログラムをどうすればいいのか教えていただけるとうれしいです。 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT LANGUAGE=javascript> <!-- function select1_onchange() { var s = select1.options(select1.selectedIndex).value; if (s == ""){return;} parent.frame2.document.bgColor = s; } //--> </SCRIPT> </HEAD> <BODY> <SELECT id=select1 style="WIDTH: 100px" name=select1 LANGUAGE=javascript onchange="return select1_onchange()"> <OPTION value="" selected>色変えます</OPTION> <OPTION value=red>赤</OPTION> <OPTION value=black>黒</OPTION> </SELECT></P> </BODY>

noname#7922
noname#7922

質問者が選んだベストアンサー

  • ベストアンサー
  • godakaz
  • ベストアンサー率72% (16/22)
回答No.3

■frame.html =============================================== <html> <head> <script language=javascript> <!-- function frm2_onload(){ var obj = frame1.document.form1.select1; var s = obj.options[obj.selectedIndex].value; if (s == ""){return;} frame2.document.bgColor = s; } //--> </script> <frameset rows=200,*> <frame src=1.html name=frame1> <frame src=2.html name=frame2> </frameset> </head> <body> </body> </html> =============================================== ■1.html =============================================== <html> <head> <script language=javascript> <!-- function select1_onchange(){ var obj = parent.frame1.document.form1.select1; var s = obj[obj.selectedIndex].value; if(s == ""){return;} parent.frame2.document.bgColor = s; } //--> </script> </head> <body> <form id=form1 name=form1> <select id=select1 name=select1 onchange="select1_onchange();"> <option value="" selected>色変えます</option> <option value=red>赤</option> <option value=black>黒</option> </select> </form> </body> </html> =============================================== ■2.html =============================================== <html> <head> </head> <body onload="parent.frm2_onload();"> <a href=3.html target="_self">3</a> </body> </html> =============================================== ■3.html =============================================== <html> <head> </head> <body onload="parent.frm2_onload();"> <a href=2.html target="_self">2</a> </body> </html> ===============================================

その他の回答 (2)

noname#3546
noname#3546
回答No.2

クッキーを使えば解決できます。 設定した色をクッキーに書き込み、 リンク先のページでそれを解読…。 私のサイトのチャットは、 この機能を実装しています。 利用者が自由に背景色を設定し、 リロード後もそのまま、です。

  • Spur
  • ベストアンサー率25% (453/1783)
回答No.1

このページで設定した色を他のページにも反映させたければ、全てのページを動的なページにして、ここで設定した色をパラメータで渡すしかないですね。

noname#7922
質問者

補足

どうやればいいのでしょうか?わからないので教えていただければ幸いです。

関連するQ&A

  • 背景色変更

    現在かなり困っています・・・。 フレームでウインドウを上下で区切って上の方のウインドウ内に以下のようなプログラムをいれ、背景色を簡単に変更できるようにしたのですが、これを上のウインドウ内ではなく下のウインドウないの背景を変えたいのですがどうすればいいのでしょうか・・? つまり、上のウインドウないのリストボックスをいじることで、下の方のウインドウ内の背景色を変更したいのです。 知っている方がいらしたら教えてください。 具体的なプログラムを教えていただけたらうれしいです。 <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> <SELECT id=select1 style="WIDTH: 100px" name=select1 LANGUAGE=javascript onchange="return select1_onchange()"> <OPTION value="" selected>色変えます</OPTION> <OPTION value=red>赤</OPTION> <OPTION value=black>黒</OPTION> </SELECT></P> </BODY>

    • ベストアンサー
    • HTML
  • リンクの色を調整する関数

    Webページ上のプルダウンメニューでテキストの色を変更する関数は作れるのですが、リンクの色を未参照/参照済みの両方とも変更する関数がどうしても作れません。 下記のソースgetElementById("text")のところを getElementById("link")としても、未参照の時の色しか変更できません。参照済みの色も併せて変更する関数は作れないでしょうか。 <html> <head> <script language="JavaScript"> function setColor(c) { document.getElementById("text").style.setAttribute("color", c); } </script> </head> <body> <div id="text">テキスト</div> <a href="http://oshiete.goo.ne.jp/" id="link">リンク</a><br> <select onChange="setColor(this.value)"> <option value="#000000">black</option> <option value="#0000ff">blue</option> <option value="#00ffff">aqua</option> <option value="#808000">olive</option> </select> </body> </html>

  • リンク

    フォームを使ったリンクがありましたので、やってみましたらこれは、できました。 それで、「同じページ」で、こんな感じのを、 「別」のを作ろうとしたのですが、できませんでした。 (動作が変でした) 「もう一種類」。別のを作るには、どうしたらいいのでしょうか? よろしくお願いいたします。 (↓これと同じでなくてもいいです) <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- function selLink(){ selurl=document.myform.mysel.options[document.myform.mysel.selectedIndex].value; if (selurl != "" )location.href=selurl; } //--> </SCRIPT> </HEAD> <BODY> <FORM name="myform"> <SELECT name="mysel" onChange="selLink()"> <OPTION value="">クイックリンク <OPTION value="index.html">トップページ <OPTION value="page12.html">解説ページ </SELECT> </FORM> </BODY> </HTML>

  • スタイルシートのフォントサイズの変更

    下記のようなことをしたいのですが、簡単かと思ったものの下記より進みませんでした。 (^^; <STYLE TYPE="text/css"> <SCRIPT language=JavaScript> function set(n) ※選択ボックスの数値を変更したときにスタイルシートのフォントサイズを変更したい。 </SCRIPT> <!-- body { font-size:★pt } --> </STYLE> <SELECT NAME="moji" onchange="set()"> <OPTION SELECTED>10</OPTION> <OPTION VALUE="20"></OPTION> <OPTION VALUE="30"></OPTION> <OPTION VALUE="40"></OPTION> <OPTION VALUE="50"></OPTION> </SELECT>

  • 値の変更をする方法を教えてください

    Javascript初心者なので、 根本的に間違っていたらすみません。 head タグ内にある、javascript 内の一行、下記値の " " 内の値を、 oparation: "aa", body タグ内に存在する下記セレクトメニューにて、値変更したいのですが、 うまくいきません。 <select id="??" onChange="javascript:???"> <option value="bb">B</option> <option value="cc">C</option> <option selected value="aa">A</option> </select> とくに、???のところなど、何を入れたらよいか、 ご教授いただけますと幸いです。 よろしくお願いいたします。

  • プルダウンメニューの項目をクリックしてもリンク先に

    <HTML> <HEAD> <TITLE>リンク先をプリダウンメニューで表示したい</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function linkMenu(m) { if(m==0)return; document.form01.url.selectedlndex = 0; if(m == 1) document.location="https://www.google.com/?hl=ja&gws_rd=ssl"; if(m == 2) document.location="http://www.yahoo.co.jp/"; } //--></SCRIPT> </HEAD> <BODY> <FORM NAME="form01"> <SELECT NAME="url" onChange="linkMenu(this.selectedlndex)"> <OPTION>クリックして選択してね <OPTION>e-support <OPTION>Office TAKASAKU </SELECT> </FORM> </BODY> </HTML> 以上ですが  プルダウンメニューの項目をクリックしてもリンク先が開かないのですが!? 何かミスがあるでしょうか!?  宜しくお願いします。

  • プルダウンメニューの選択時のリンク先について

    「プルダウンメニューから選択すると、別ページにリンク」するページを 作成したいです。 以下の様に途中まではできたのですが、 「フレームを使わず、同じウインドウの別の箇所にリンク先を表示  ※プルダウンメニューはそのまま表示」 がどうしてもできません。xmlで作成している関係上、phpも使えません。 何か方法はありませんでしょうか。 <SCRIPT LANGUAGE="JavaScript"> <!-- function menuLink(linkLoc) { if(linkLoc !="") {window.aaa.location.href=linkLoc;} } //--> </SCRIPT> <form> <SELECT onChange="menuLink(this.options[this.selectedIndex].value)"> <OPTION SELECTED>Select</OPTION> <OPTION value="">××</OPTION> <OPTION value="">●●</OPTION> </SELECT> </form>

  • プルダウンのメニューを表示を2つ設定。

    プルダウンのメニューを表示を2つ設定したいのですが、 どこが間違っているのでしょうか。 基本的にjsは、セレクタ名がかぶっていれば、機能しなくなります。 間違いをご指摘ください。 <!DOCTYPE html> <html> <head> <title></title> <script language="javascript" type="text/javascript"> function selectboxChange() { var val1 = document.forms.form1.Select1.value; var target = document.getElementById("output"); if (val1 == "要素1") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form name="form1" action=""> <select id="Select1" onchange="selectboxChange();"> <option>---</option> <option value1 == "要素1">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div id="output"></div> </body> </body> <script language="javascript" type="text/javascript"> function selectboxChange11() { var val11 = document.forms.form11.Select11.value; var target = document.getElementById("output11"); if (val11 == "要素11") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form name="form11" action=""> <select id="Select11" onchange="selectboxChange11();"> <option>---</option> <option value11 == "要素11">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div id="output11"></div> </body> </body> </html>

  • セレクトメニューのリンク先を隣のフレームに表示したい。

    左側の細いフレームにセレクトメニューを設置しました。 メニューを選んで、go!をクリックして、リンクするときメインのフレームに開くようにしたいのですが・・・。 ターゲットはどこに記述すればよいですか? お忙しいところ申し訳ありませんが、教えてください。 よろしくお願いします。 *head部分の記述 <SCRIPT LANGUAGE="JavaScript"> <!-- function gotoURL(){ var gotoUrl=document.f0.f0e0.options[document.f0.f0e0.selectedIndex].value document.location.href=gotoUrl} //--> </SCRIPT> *body部分の記述 <FORM NAME="f0"> <div align="center"> <SELECT NAME="f0e0"> <option value="../kensaku/chikukensaku.html" selected>宮崎市</option> <option value="no">延岡市</option> <option value="mj">都城市</option> <option value="kb">小林市</option> <option value="gb">郡部</option> </SELECT> <INPUT TYPE=BUTTON VALUE="GO!" onClick="gotoURL()"> </div> </FORM>

  • ページが切り替わるスクリプトで最初から指定のページを表示させる

    <html> <head> <script type="text/javascript" language="JavaScript"> <!-- JavaScript小技集 2005. 6.17 function showthis(obj) { if(!obj) return false; if(document.getElementById) { document.getElementById("item1").style.display = "none"; document.getElementById("item2").style.display = "none"; document.getElementById("item3").style.display = "none"; document.getElementById(obj).style.display = "block"; } else { return false; } } // --> </script> <style type="text/css"> #item1,#item2,#item3 { display: none; } </style> </head> <body> <form> <select onchange="showthis(this.value)"> <option selected="selected">記事を選ぶ</option> <option value="item1">記事1</option> <option value="item2">記事2</option> <option value="item3">記事3</option> </select> </form> </body> <html> これなんですが、これを貼ってあるページを読み込んだ際、最初からitem1を表示した状態にしたいのですが どうすればよいのでしょう?