susie-t の回答履歴

全94件中21～40件表示
  • DIV内のDIV要素を移動する。

    いつもお世話になります。 DIV内にDIVをいくつか作り、position:absolute; で、それぞれ位置を指定します。 この、DIV内のDIVをマウスによりその位置を移動するにはどのようにしたらよいものでしょうか。 BODYタグ内のDIVについてのサンプルは、 http://jsm.suepon.com/script/jsm31.html に、わかりやすいものが掲載してありましたが、 これを基にと思うのですが、行き詰まってしまいました。 おわかりになる方見えましたら、どうかよろしくお願いします。

  • DIV内のDIV要素を移動する。

    いつもお世話になります。 DIV内にDIVをいくつか作り、position:absolute; で、それぞれ位置を指定します。 この、DIV内のDIVをマウスによりその位置を移動するにはどのようにしたらよいものでしょうか。 BODYタグ内のDIVについてのサンプルは、 http://jsm.suepon.com/script/jsm31.html に、わかりやすいものが掲載してありましたが、 これを基にと思うのですが、行き詰まってしまいました。 おわかりになる方見えましたら、どうかよろしくお願いします。

  • DIV内のDIV要素を移動する。

    いつもお世話になります。 DIV内にDIVをいくつか作り、position:absolute; で、それぞれ位置を指定します。 この、DIV内のDIVをマウスによりその位置を移動するにはどのようにしたらよいものでしょうか。 BODYタグ内のDIVについてのサンプルは、 http://jsm.suepon.com/script/jsm31.html に、わかりやすいものが掲載してありましたが、 これを基にと思うのですが、行き詰まってしまいました。 おわかりになる方見えましたら、どうかよろしくお願いします。

  • Cookieの保存と取り出し

    いつもお世話になります。 下記のソースで、選択項目をクッキーに保存、保存したクッキーの表示、削除を行おうと考えました。 Alertで見るとクッキーの保存はできているようですが、呼び出すと違う項目が表示されてしまいます。 　すみませんが、どなたかお助けください <html> <head><TITLE></TITLE> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS"> <script src="cookie2.js" language="JavaScript"></script> </head> <body onLoad="getCookieData()"> <br> <FORM action="job_conf.php" method="post" name="calf1"> <input type="button" onclick="setCookieData();" value="保存"> <input type="button" onclick="getCookieData();" value="呼び出し"> <input type="button" onclick="clsCookieData();" value="削除"> <table border=1> <tr> <td><b><font size=-1>JOB1</b></font></td> <td><select name="job1"> <option selected></option> <option value="windows98">Windows98</option> <option value="windows2000">Windows2000</option> <option value="windowsxp">WindowsXP</option> <option value="windowsvista">WindowsVista</option> <option value="linux">Linux</option> <option value="mac">Mac</option> </td> </tr> <tr> <td><b><font size=-1>JOB2</b></font></td> <td><select name="job2"> <option selected></option> <option value="windows98">Windows98</option> <option value="windows2000">Windows2000</option> <option value="windowsxp">WindowsXP</option> <option value="windowsvista">WindowsVista</option> <option value="linux">Linux</option> <option value="mac">Mac</option> </td> </tr> </table> </FORM> </BODY> </HTML> ----- cookie2.js ----- function setCookieData() { val1=document.calf1.job1.value; val2=document.calf1.job2.value; val = val1+val2; if(!val) { alert("値を下記より選択してください"); document.calf1.job1.focus(); } var setval =val1 + "=" + val2; var essetval = escape(setval); document.cookie=essetval+ "=expires =Tue ,31-Dec-2030 23:59:59;"; alert(document.cookie); } function getCookieData() { if(document.cookie); { val=document.cookie; getval = unescape(val); var v = getval.split("="); if(v[0]) { document.calf1.job1.value = v[0]; } if(v[1]) { document.calf1.job2.value = v[1]; } else if ((!v[0])&&(!v[1])) { alert("保存内容はありません"); document.calf1.job1.focus(); } } } function clsCookieData() { delcookie = "setval="; document.cookie ="setval;expires = Sun,31-Dec-2000 23:59:59;"; document.calf1.job1.value = document.calf1.job2.value = document.calf1.job3.value = ""; }

  • html読み込みを制御

    htmlのページを読み込む時にある部分だけ読み込みに制限を与えたいと思っています。こんな感じってサンプルをアップしてありますのでご覧になりアドバイスいただければと思います。 http://vivibibivivi.blog121.fc2.com/ ここの「開く」をクリックした時点で読み込みをさせたいのですが可能でしょうか？（インラインフレームは使いたくありません・あくまでも同じhtml上が希望です） 例えば画像等読み込みに時間のかかるモノは来場者の意志で読み込みをさせたいと言うかtopページは軽くしたいと言うか・・・でもページを複数に分けたくない理由があり・・・ すみません説明が下手で・・・ どなたかよろしくお願いします。

  • 移動できる顔文字とマウスポインタとのズレが生じる

    顔文字をマウスポインタで移動できるようにしたのですが、 画面上では問題ないのですが画面下の方に移動させると顔文字とマウスポイントの位置が重ならず距離が生じてしまいます。マウスポイントと顔文字が重なって移動するようにするにはどうすればいいでしょうか？ 宜しくお願いいたします。 <HTML> <HEAD><TITLE>オブジェクトをドラッグ＆ドロップで移動したい</TITLE> </HEAD> <SCRIPT language="JavaScript"> var target; var isDrag=0; function document_onmousedown(){ isDrag=1; target=event.srcElement;} function document_onmousemove(){ if( isDrag ){ target.style.top=event.clientY-8; target.style.left=event.clientX-8;} } function document_onmouseup(){ isDrag=0; } </SCRIPT> <BODY onmousemove="document_onmousemove()" onmousedown= "document_onmousedown()" onmouseup="document_onmouseup()"> <DIV id=text1 style="position:absolute;font-size:24px; cursor:hand"> (^ ^; </DIV> <BR> <BR> <BR> <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a </body> </HTML>

    • ベストアンサー
    • noname#52471
    • JavaScript
    • 回答数2
  • 移動できる顔文字とマウスポインタとのズレが生じる

    顔文字をマウスポインタで移動できるようにしたのですが、 画面上では問題ないのですが画面下の方に移動させると顔文字とマウスポイントの位置が重ならず距離が生じてしまいます。マウスポイントと顔文字が重なって移動するようにするにはどうすればいいでしょうか？ 宜しくお願いいたします。 <HTML> <HEAD><TITLE>オブジェクトをドラッグ＆ドロップで移動したい</TITLE> </HEAD> <SCRIPT language="JavaScript"> var target; var isDrag=0; function document_onmousedown(){ isDrag=1; target=event.srcElement;} function document_onmousemove(){ if( isDrag ){ target.style.top=event.clientY-8; target.style.left=event.clientX-8;} } function document_onmouseup(){ isDrag=0; } </SCRIPT> <BODY onmousemove="document_onmousemove()" onmousedown= "document_onmousedown()" onmouseup="document_onmouseup()"> <DIV id=text1 style="position:absolute;font-size:24px; cursor:hand"> (^ ^; </DIV> <BR> <BR> <BR> <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a <BR>a </body> </HTML>

    • ベストアンサー
    • noname#52471
    • JavaScript
    • 回答数2
  • イベント？動作の位置を画面の真ん中にするには？

    ジャバスクリプトの動作を中心にする方法がわかりません。 http://www.openspc2.org/HTML_JS_CSS/table/006/ ↑これなんですが、このプログラムを、画面の真ん中に配置したいんですが、どこにどのように手を加えていいかわかりません。 画面の真ん中とは、これを見る環境に関わらず、インターネットエクスプローラーで見たときに、中央に配置という意味です。 ＨＴＭＬでいう<centr>みたいなものです。 下記にプログラムを載せておきました。 私の説明で分からなかったら、補足で回答します。 <title>クリックで表示するテーブルをスクロールさせて切り替える</title> <script language="JavaScript"><!-- tMax = 5; //　テーブル個数 tWidth = 200; //　１つのテーブル幅 step = 10; //　１回の移動量（単位：ピクセル） num = 0; offset = 0; flag = false; function scrollSetTBL(n) { if (flag) return; num += n; if (num < 0) { num = 0; return; } if (num >=tMax) { num = tMax-1; return; } offset = n * step; count = tWidth / step; setTimeout("scrollTBL()",10); flag = true; } function scrollTBL() { scrlTBL.style.pixelLeft -= offset; count--; if (count > 0) setTimeout("scrollTBL()",10); else flag = false; } // --></script> </head> <body> <img src="left.gif" onMousedown="scrollSetTBL(-1)" style="position:absolute;top:200px;left:20px;"> <img src="right.gif" onMousedown="scrollSetTBL(1)" style="position:absolute;top:200px;left:60px;"> <div style="position:absolute;top:10px;left:10px;clip:rect(0px 200px 200px 0px)"> <table id="scrlTBL" border="0" cellspacing="0" cellpadding="0" style="position:absolute;top:0px;left:0px;"> (以下略)

    • ベストアンサー
    • noname#57880
    • JavaScript
    • 回答数1
  • イベントハンドラに処理を追加するには？

    例えばbodyタグのonloadイベントハンドラに JavaScriptを使って処理を追加するにはどうすればよいのでしょうか？ 例） ・rei.htm <html> 　<script language="JavaScript" type="text/javascript"> 　function hoge(){ 　　alert("hogeです"); 　} 　function foo(){ 　　alert("fooです"); 　} 　</script> 　<body onload="hoge();"> 　</body> 　<script language="JavaScript" type="text/javascript"> 　document.body.onload += foo(); 　</script> <html> ※前提条件として、変更可能な箇所はscriptタグ内のみとなります。 「こんなんでいけないかな？」と思って上記のようにやってみたのですがうまくいきませんでした。 （結果はfoo()のみ実行され、hoge()は実行されませんでした。 alertでbody.onloadの中身を確認すると『function anonymous{hoge();}undefined』と表示されるので、なぜfoo()が実行されてhoge()が実行されないのかよくわかりませんが‥） また試しに document.body.onload += foo(); これを以下のように変更してみました。 document.body.onload = foo(); この時は、 ・foo()の実行 　↓ ・javascriptエラー 　↓ ・hoge()の実行 となりました。（これもなぜこうなるのかよくわかりせん） 以上、イベントハンドラに最初から任意に入れられている処理を残しつつ、 さらに処理を加えるにはどうすればよいのかご教示お願いします。

  • イベントハンドラに処理を追加するには？

    例えばbodyタグのonloadイベントハンドラに JavaScriptを使って処理を追加するにはどうすればよいのでしょうか？ 例） ・rei.htm <html> 　<script language="JavaScript" type="text/javascript"> 　function hoge(){ 　　alert("hogeです"); 　} 　function foo(){ 　　alert("fooです"); 　} 　</script> 　<body onload="hoge();"> 　</body> 　<script language="JavaScript" type="text/javascript"> 　document.body.onload += foo(); 　</script> <html> ※前提条件として、変更可能な箇所はscriptタグ内のみとなります。 「こんなんでいけないかな？」と思って上記のようにやってみたのですがうまくいきませんでした。 （結果はfoo()のみ実行され、hoge()は実行されませんでした。 alertでbody.onloadの中身を確認すると『function anonymous{hoge();}undefined』と表示されるので、なぜfoo()が実行されてhoge()が実行されないのかよくわかりませんが‥） また試しに document.body.onload += foo(); これを以下のように変更してみました。 document.body.onload = foo(); この時は、 ・foo()の実行 　↓ ・javascriptエラー 　↓ ・hoge()の実行 となりました。（これもなぜこうなるのかよくわかりせん） 以上、イベントハンドラに最初から任意に入れられている処理を残しつつ、 さらに処理を加えるにはどうすればよいのかご教示お願いします。

  • Javaスクリプトで任意のページに飛ばしたい

    はじめまして。 例えば、外部から、http://xxxxx.xxx.ne.jp/menu.htmlにアクセスがあった場合、http://xxxxx.xxx.ne.jp/に自動的に飛んで、http://xxxxx.xxx.ne.jp/からhttp://xxxxx.xxx.ne.jp/menu.htmlにアクセスした場合は、http://xxxxx.xxx.ne.jp/menu.htmlが表示される・・・というようなJavaスクリプトを、ご存知の方がいらっしゃったら教えていただきたいのですが。 よろしくお願いします。 （分かりにくい説明で申し訳ありません）

  • JavascriptのDOMのサンプルがほしい・・・

    はじめまして。 現在Javascriptを学習中なのですが、これからDOMについて学習しよう と思い、手元の参考書を読んでいるのですが、サンプルがほとんど 載っていないので効率的な学習ができません。どなたか DOMのサンプルコードがたくさん出ているサイトや書籍がありました ら、教えていただけませんでしょうか？

  • onMouseOverで複数（？）のセル内の色を変更したいとき

    はじめまして、こんにちは。 初歩的な質問なので恐縮ですが、、どうしてもわからないのでどなたか教えてください(> <) テーブルの各行の上をカーソルが通過するとその行の色が変わる（通過しおわると元の色に戻る）というのをプログラムを作りたいのです。。 一行ごとでしたらonMouseOver,onMouseoutを使って 簡単にできますが、カーソルが『りんご』の行の上にあるときは『くだもの』のセルも一緒に色を変える、また『みかん』の行の上のときも『くだもの』のセルも一緒に色を変える・・・というように『バナナ』も『メロン』も同じように色変更させたいのです・・・ 説明が下手で大変申し訳ございませんが、どうかよろしくお願い致します。（ジャバスクリプトは勉強を始めたばかり・・・というレベルなのです比較的簡単なソースでお願いします） ソースは下記になります↓ <table width="300" border="0" cellspacing="0" cellpadding="0"> <tr> <td rowspan="4">くだもの</td> <td>りんご</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>みかん</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>バナナ</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>メロン</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td rowspan="2">野菜</td> <td>なす</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>とまと</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> </table> よろしくお願い致しますm(__)m

  • イベントハンドラに処理を追加するには？

    例えばbodyタグのonloadイベントハンドラに JavaScriptを使って処理を追加するにはどうすればよいのでしょうか？ 例） ・rei.htm <html> 　<script language="JavaScript" type="text/javascript"> 　function hoge(){ 　　alert("hogeです"); 　} 　function foo(){ 　　alert("fooです"); 　} 　</script> 　<body onload="hoge();"> 　</body> 　<script language="JavaScript" type="text/javascript"> 　document.body.onload += foo(); 　</script> <html> ※前提条件として、変更可能な箇所はscriptタグ内のみとなります。 「こんなんでいけないかな？」と思って上記のようにやってみたのですがうまくいきませんでした。 （結果はfoo()のみ実行され、hoge()は実行されませんでした。 alertでbody.onloadの中身を確認すると『function anonymous{hoge();}undefined』と表示されるので、なぜfoo()が実行されてhoge()が実行されないのかよくわかりませんが‥） また試しに document.body.onload += foo(); これを以下のように変更してみました。 document.body.onload = foo(); この時は、 ・foo()の実行 　↓ ・javascriptエラー 　↓ ・hoge()の実行 となりました。（これもなぜこうなるのかよくわかりせん） 以上、イベントハンドラに最初から任意に入れられている処理を残しつつ、 さらに処理を加えるにはどうすればよいのかご教示お願いします。

  • Javaスクリプトで任意のページに飛ばしたい

    はじめまして。 例えば、外部から、http://xxxxx.xxx.ne.jp/menu.htmlにアクセスがあった場合、http://xxxxx.xxx.ne.jp/に自動的に飛んで、http://xxxxx.xxx.ne.jp/からhttp://xxxxx.xxx.ne.jp/menu.htmlにアクセスした場合は、http://xxxxx.xxx.ne.jp/menu.htmlが表示される・・・というようなJavaスクリプトを、ご存知の方がいらっしゃったら教えていただきたいのですが。 よろしくお願いします。 （分かりにくい説明で申し訳ありません）

  • JavaScriptにおいて、「同一ページ」で、下記の「2種類のイベント」

    JavaScriptにおいて、「同一ページ」で、下記の「2種類のイベント」 hyouzi() msg6() を実行したいのですが、どのように、表記したらいいのでしょうか? よろしく、お願いいたします。 このままではいけないんですよね? (^^; <BODY onload="hyouzi()"> <BODY onload="msg6()">

  • テーブルをクイックソートするには？

    未経験者として、今年入社したばかりの超初心者です。 javascriptを始めて、３ヶ月です。 「テーブルをクイックソートする」課題が出たのですが、アルゴリズムデータ構造が分かっておらずとても困っています。 スクリプトは以下です。 どうか、アドバイスをお願いします！！ <html> <head> <meta http-equiv="Content-Language" content="ja"> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>ソート</title> <script language ="JavaScript"> <!-- var x=new Array(); var nodeArray=new Array(); var n; function TableSort() { var tbd1 = document.getElementById("tbd1"); //ドキュメントにある特定のIｄを持つオブジェクトを示す //HTMLタグのID属性で指定したもの var tre = tbd1.getElementsByTagName("tr") ; // タグを取得する n = tre.length ; // 行の数 for(i=0;i<n;i++) { if (document.getElementById("tr"+i)) { // alert(document.getElementById("tr"+i)); nodeArray[i]=document.getElementById("tr"+i); } } } function show() { tbody=document.getElementById('tbd1'); for(i=0;i<n;i++) { tbody.removeChild(nodeArray[i]); //子供のノードオブジェクトを削除 } for(i=0;i<n;i++) { tbody.appendChild(nodeArray[i]); //子供のノードオブジェクトを追加 } } function stringSort(0) { start = x[0]; end = x[n-1]; for(i=0;i<n;i++) { xval=nodeArray[i].childNodes[k].firstChild.nodeValue; //ソート対象となるデータをxの配列に設定している x[i]=xval; } quickSort(x,start,end); show(); } function quickSort(x,start,end){ // var data = Math.floor((x[start]+x[end])/2); //基準値（平均を適用）小数点以下切捨て var i = start; var j = end; var e; e = x[start]; while(true){ while(x[i] < e) i++; //基準値より大きい値を先頭から探す while(x[j] > e) j--; //基準値より小さい値を末尾から探す if( i >= j ) break; //両者が交錯していたら抜ける var n =x[i]; //交錯していなければ値を交換 x[i] =x[j]; x[j] =n; i++; // 交換した一つ後に添え字を進める j--; // 交換した一つ前に添え字を進める } if(start < i-1) quickSort(x,start,i-1); // 基準値より小さいグループの再起処理 if(j+1 < end) quickSort(x,j+1 ,end); // 基準値より大きいグループの再起処理 } //--> </script> </head> <body onload="TableSort();stringSort(0)" bgcolor="pink"> <!--<img src="img/59.gif">--> <tr><th><big><strong>数字をソートしよう！！</strong></big></th></tr> <br> <br><p>　　　　　　　　↓click here!!</p> <table border=1 id="tb1" width=200 bgcolor="white"> <thead > <tr> <th><button onclick="stringSort(0)">push!!</button></th> </tr> </thead> <tbody> <tr><td align=center>48</td></tr> <tr><td align=center>24</td></tr> <tr><td align=center>36</td></tr> <tr><td align=center>18</td></tr> <tr><td align=center>52</td></tr> </tbody> </table> </body> </html>

  • テーブルをクイックソートするには？

    未経験者として、今年入社したばかりの超初心者です。 javascriptを始めて、３ヶ月です。 「テーブルをクイックソートする」課題が出たのですが、アルゴリズムデータ構造が分かっておらずとても困っています。 スクリプトは以下です。 どうか、アドバイスをお願いします！！ <html> <head> <meta http-equiv="Content-Language" content="ja"> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>ソート</title> <script language ="JavaScript"> <!-- var x=new Array(); var nodeArray=new Array(); var n; function TableSort() { var tbd1 = document.getElementById("tbd1"); //ドキュメントにある特定のIｄを持つオブジェクトを示す //HTMLタグのID属性で指定したもの var tre = tbd1.getElementsByTagName("tr") ; // タグを取得する n = tre.length ; // 行の数 for(i=0;i<n;i++) { if (document.getElementById("tr"+i)) { // alert(document.getElementById("tr"+i)); nodeArray[i]=document.getElementById("tr"+i); } } } function show() { tbody=document.getElementById('tbd1'); for(i=0;i<n;i++) { tbody.removeChild(nodeArray[i]); //子供のノードオブジェクトを削除 } for(i=0;i<n;i++) { tbody.appendChild(nodeArray[i]); //子供のノードオブジェクトを追加 } } function stringSort(0) { start = x[0]; end = x[n-1]; for(i=0;i<n;i++) { xval=nodeArray[i].childNodes[k].firstChild.nodeValue; //ソート対象となるデータをxの配列に設定している x[i]=xval; } quickSort(x,start,end); show(); } function quickSort(x,start,end){ // var data = Math.floor((x[start]+x[end])/2); //基準値（平均を適用）小数点以下切捨て var i = start; var j = end; var e; e = x[start]; while(true){ while(x[i] < e) i++; //基準値より大きい値を先頭から探す while(x[j] > e) j--; //基準値より小さい値を末尾から探す if( i >= j ) break; //両者が交錯していたら抜ける var n =x[i]; //交錯していなければ値を交換 x[i] =x[j]; x[j] =n; i++; // 交換した一つ後に添え字を進める j--; // 交換した一つ前に添え字を進める } if(start < i-1) quickSort(x,start,i-1); // 基準値より小さいグループの再起処理 if(j+1 < end) quickSort(x,j+1 ,end); // 基準値より大きいグループの再起処理 } //--> </script> </head> <body onload="TableSort();stringSort(0)" bgcolor="pink"> <!--<img src="img/59.gif">--> <tr><th><big><strong>数字をソートしよう！！</strong></big></th></tr> <br> <br><p>　　　　　　　　↓click here!!</p> <table border=1 id="tb1" width=200 bgcolor="white"> <thead > <tr> <th><button onclick="stringSort(0)">push!!</button></th> </tr> </thead> <tbody> <tr><td align=center>48</td></tr> <tr><td align=center>24</td></tr> <tr><td align=center>36</td></tr> <tr><td align=center>18</td></tr> <tr><td align=center>52</td></tr> </tbody> </table> </body> </html>

  • 入力フォームの文字の大きさとフォント種類を表示させたい

    入力フォームの文字の大きさとフォント種類を 確認ボタンで画面上に表示させたいのですが、エラーになってしまいます。また、文字の大きさは反映されますが、フォントの種類は反映されません。どのようにすればいいでしょうか？ <HTML> <HEAD> <STYLE type="text/css"> <!-- INPUT {font-size: 12px;} --> </STYLE> <SCRIPT language="JavaScript"> <!-- // フォームの文字の大きさと種類を変更 function sizeTxt(n){ document.nForm.textN.style.fontSize = n.options[n.selectedIndex].value + "px"; } function fontTxt(n){ document.nForm.textN.style.fontFamily = n.options[n.selectedIndex].value; } function check(){ var strName; strName = document.nForm.textN.value; var test = document.getElementById("test"); test.innerHTML = strName; var strName2; strName2 = document.nForm.textN.value; var test2 = document.getElementById("test2"); test2.innerHTML = strName2; var size = document.nForm.sizeSelect; test.style.fontSize = size.options[size.selectedIndex].value + "px"; var element = document.nFORM.fontSelect; test2.style.fontFamily = element.options[element.selectedIndex].value; } </SCRIPT> </HEAD> <BODY> <FORM name="nForm" > フォントサイズを選択できます。<br> <SELECT onChange="sizeTxt(this)" name="sizeSelect"> <OPTION value="8">8px</OPTION> <OPTION value="10">10px</OPTION> <OPTION value="12" selected>12px</OPTION> <OPTION value="16">16px</OPTION> <OPTION value="20">20px</OPTION> <OPTION value="24">24px</OPTION> <OPTION value="30">30px</OPTION> </SELECT><br><br> フォント種類を選択できます。<br> <SELECT onChange="fontTxt(this)" name="fontSelect"> <OPTION value="ＭＳ ゴシック">ゴシック</OPTION> <OPTION value="ＭＳ 明朝" selected>明朝</OPTION> </SELECT><BR><BR> <INPUT type="text" size="45" name="textN"><BR> <input type="button" value=" 確認 " onClick="check()"> </FORM> <DIV id="test" id="test2" id=text style="position:absolute;font-size:24px;font-family: Verdana, sans-serif;"> </DIV> <SCRIPT language="JavaScript"> </SCRIPT> </BODY> </HTML>

    • ベストアンサー
    • noname#52471
    • JavaScript
    • 回答数1
  • クラスの中にある関数を使いたい

    次のようなクラスを使ってエレメントを作った時に、 マウスを重ねたらハイライト表示っぽくさせるために、 onmouseoverにこのクラスのメンバ関数setBackgroundColorをセットしたいのですが、 クラス内で使う時は先頭にthisが必要になると思います。 そのthisはどうやって取り出したら良いのでしょうか？ それかこのやり方は間違っていて、別のやり方でやった方が良いのでしょうか？ function TextObj(text) { //実体を作る var textNode = document.createTextNode(text); var spanElement = document.createElement("span"); spanElement.style.position = "absolute"; spanElement.appendChild(textNode); document.body.appendChild(spanElement); //オブジェクトへの参照を保存 this.obj = spanElement; } TextObj.prototype.setMouseOver = function() { this.obj.onmouseover = function(){ setBackgroundColor(255,255,255);←ここでこの関数を使いたい } } TextObj.prototype.setBackgroundColor = function(red, green, blue) { this.obj.style.backgroundColor = "rgb(" + red + "," + green + "," + blue + ")"; }

活動履歴