今だけ人気マンガ100円レンタル特集♪

こんなことできるのでしょうか?
商品リストぽいモノを作りたいのですが

A,******* ┏━━━━┓
B,******* ┃内容表示┃
C,******* ┃内容表示┃
D,******* ┗━━━━┛

上図の様に1画面に選択項目とそれに関する内容を表示する枠を準備して
各項目を洗濯するとその内容が内容表示用の枠内に表示されるようにしたいのですが可能でしょうか?

このQ&Aに関連する最新のQ&A

A 回答 (4件)

色々な方法が有ると思います。


”その内容が内容表示用の枠内に表示”で枠内にこだわるのでしたらインラインフレームを使われては如何でしょうか?
とほほさんの有名なページのURLを下記から参考になさって下さい。

参考URL:http://tohoho.wakusei.ne.jp/html/iframe.htm

この回答への補足

moccosさん、ありがとうございます。
インラインフレームですが参考URLを見たところ"画面中央に表示できる"とのことですが任意の位置に表示することは出来ないのでしょうか?

補足日時:2002/08/23 09:01
    • good
    • 0

フレームは回答されているので後は、LAYERを使用する方法とかですね。


>とほほさんの有名なページのURLを下記から参考になさって下さい。
参考URLは、No.1さんと同じく。

参考URL:http://tohoho.wakusei.ne.jp/html/layer.htm
    • good
    • 0
この回答へのお礼

BlueRayさん、ありがとうございます。
とほほさんのページみました。
ただLAYERですがIEではサポートされてないようで・・・(汗)
LAYERのIE版があればいいのかも知れませんね。
とほほさんのページの存在を知れただけでもありがたいです。
じっくり調べてみます。

お礼日時:2002/08/23 09:14

フレーム機能を使えば出来ます。


まず
トップのHTMLで
<html>
<head>
<title>タイトル</title>
</head>
<frameset COLS="280,*" >
<frame src="./A.HTML" name="MIGI" >
<frame src="./B.HTML" name="HIDARI" >
</frameset>
</html>
とすれば画面が左右に作られ"A.HTML"が左でで選択を行い"B.HTML"を右で内容表示が出来ます。
"A.HTML"に下記のような記述で"C.HTML"が右側に表示されます。


<p><a href="C.HTML" target="MIGI">表示画面名</a></p>

    • good
    • 1

フレームを細かく分ければ出来ますよー(^.^)

    • good
    • 0

このQ&Aに関連する人気のQ&A

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

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qwebページの一部のみの更新について

JavaScript初心者です。
PHPとXHTMLでHPを作成中ですが、タイトルにあるようにHPの一部のみ更新することが可能でしょうか?
JavaScriptで不可能な場合はどの言語で出来ますか?
やりたいことはセレクトで選択したらobjectで表示中のページのみ変更する事です。
分からないなりに作ってみたサンプルの結果がこれです。

index.php
------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>サンプル</title>
</head>
<body>
<div>
<div>
<form action="aaa.php" method="post">
<select name="category" id="category" onchange="submit();">
<option value="0">A</option>
<option value="1">B</option>
<option value="2">C</option>
<option value="3">D</option>



<option value="25">Z</option>
</select>
</form>
<object data='test.php?category='<?=$_POST['category']?> height="50" width="200" ></object>
</div>
ここに別要素の表示<br />
出来れば更新したくない。
<div>

</div>
</body>
</html>
------------------------

test.php
------------------------
<html>
<body>
<?php
if($_POST['category']==0){
$a='AAA';
}elseif($_POST['category']==1){
$a='BBB';
}elseif($_POST['category']==2){
$a='CCC';
}elseif($_POST['category']==3){
$a='ddd';

}elseif($_POST['category']==25){
$a='ZZZ';
}
print $a.'が選択されました。';

?>
</body>
</html>
------------------------

これだとtest.phpにパラメータが送れませんし、セレクトで選択しても更新がかかって初期のAに戻ってしまいます。
かといって<form action="test.php" method="post">にするとtest.phpへ飛んでしまいます。
出来れば詳しいサンプルコードを教えていただけるとありがたいです。

JavaScript初心者です。
PHPとXHTMLでHPを作成中ですが、タイトルにあるようにHPの一部のみ更新することが可能でしょうか?
JavaScriptで不可能な場合はどの言語で出来ますか?
やりたいことはセレクトで選択したらobjectで表示中のページのみ変更する事です。
分からないなりに作ってみたサンプルの結果がこれです。

index.php
------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.o...続きを読む

Aベストアンサー

全部phpで処理しているなら、
別要素を表示するphpをaaa.phpとして、test.phpと同じく下のように作っておいて
<aaa.php>
------------------------
<html>
<body>
<?php
if($_GET['category']==0){
$a='aaa';
}elseif($_GET['category']==1){
$a='bbb';
}elseif($_GET['category']==2){
$a='CCC';
}elseif($_GET['category']==3){
$a='ddd';
}elseif($_GET['category']==25){
$a='ZZZ';
}
print(file_get_contents($a . ".htm"));
?>
</body>
</html>
------------------------
これを呼び出す別の<object>をindex.phpで出力すればよい
<index.php>
------------------------
<body>
<div>
<div>
<?php
$selected["category"][$_POST["category"]]=" selected";
print <<<eof1
<form method="post" action="{$_SERVER["PHP_SELF"]}">
<select name="category" id="category" onchange="this.form.submit();">
<option value="0"{$selected["category"]["0"]}>A</option>
<option value="1"{$selected["category"]["1"]}>B</option>
<option value="2"{$selected["category"]["2"]}>C</option>
<option value="3"{$selected["category"]["3"]}>D</option>
</select>
</form>
<object data="test.php?category={$_POST['category']}" height="50" width="200" ></object>
eof1;
?>
</div>
ここに別要素の表示<br />
<?php
print <<<eof2
<object data="aaa.php?category={$_POST['category']}" height="480" width="600" ></object>
eof2;
?>
</div>
</body>
------------------------

test.php
------------------------
<html>
<body>
<?php
if($_POST['category']==0){
$a='AAA';
}elseif($_POST['category']==1){
$a='BBB';
}elseif($_POST['category']==2){
$a='CCC';
}elseif($_POST['category']==3){
$a='ddd';

}elseif($_POST['category']==25){
$a='ZZZ';
}
print $a.'が選択されました。';

?>
</body>
</html>
------------------------

全部phpで処理しているなら、
別要素を表示するphpをaaa.phpとして、test.phpと同じく下のように作っておいて
<aaa.php>
------------------------
<html>
<body>
<?php
if($_GET['category']==0){
$a='aaa';
}elseif($_GET['category']==1){
$a='bbb';
}elseif($_GET['category']==2){
$a='CCC';
}elseif($_GET['category']==3){
$a='ddd';
}elseif($_GET['category']==25){
$a='ZZZ';
}
print(file_get_contents($a . ".htm"));
?>
</body>
</html>
------------------------
これを呼...続きを読む

Q指定されるdiv の部分の再読み込み処理について

javascript についてあまりわからないですが、javascript で以下のようなことをしたいですが、よくやり方がわかないので、わかっている方は教えていただきたいです。
<div id="sample">
この部分には、DBからデータを取り出す処理が入っているとする
</div>

form でsubmitをすると、id が sampleのところの処理を更新してくれる
ようなjavascript はどうやって実現しますか?
よろしくお願いします。

Aベストアンサー

超適当に書いて見た。適切に直してね
<script>
function Getdata() {
var xmlHttp = (window.ActiveXObject)?new ActiveXObject("Msxml2.XMLHTTP"):new XMLHttpRequest();
xmlHttp.open("POST","DB_Access.php",true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
var Querydata="prm1=val1&prm2=val2&prm3=val3"; //<=から取ればよい。
xmlHttp.send("Querydata");
xmlHttp.onreadystatechange = function(){
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
document.getElementById("sample").innerHTML=xmlHttp.responseText;
}
};
}
</script>
<form action="#">
------
<input type="submit" onclick="Getdata();return false;">
</form>

超適当に書いて見た。適切に直してね
<script>
function Getdata() {
var xmlHttp = (window.ActiveXObject)?new ActiveXObject("Msxml2.XMLHTTP"):new XMLHttpRequest();
xmlHttp.open("POST","DB_Access.php",true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
var Querydata="prm1=val1&prm2=val2&prm3=val3"; //<=から取ればよい。
xmlHttp.send("Querydata");
xmlHttp.onreadystatechange = function(){
if (xmlHttp.readyState == 4 && xmlHttp.stat...続きを読む

Qjavascriptでセレクトボックスの"selected"を動的につ

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
</select>月

<select name='day'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
<option value='13'>13</option>
<option value='14'>14</option>
<option value='15'>15</option>
<option value='16'>16</option>
<option value='17'>17</option>
<option value='18'>18</option>
<option value='19'>19</option>
<option value='20'>20</option>
<option value='21'>21</option>
<option value='22'>22</option>
<option value='23'>23</option>
<option value='24'>24</option>
<option value='25'>25</option>
<option value='26'>26</option>
<option value='27'>27</option>
<option value='28'>28</option>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日


このセレクトボックスに、例えば今日の日付"2010年9月30日"だったら、それぞれの年、月、日の<option>に"selected"をつけたいのですが、javascriptではどのようにして実現したら良いのでしょうか?

よろしくお願いします。

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8...続きを読む

Aベストアンサー

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<option value='2009'>2009</option>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
</select>月

<select name='day'>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日
</div>
</form>

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<opt...続きを読む

QHTMLファイル同士での値渡し

困っています。

HTMLファイルからHTMLファイルへ移動するときに、
HTMLファイル1でJavaScript で算出された値を
HTMLファイル2へ渡して使用したいのです。

showModalDialogだとダイアログにしか渡せないし・・・。
このように、値をそのまま次のページに渡すための方法を教えてください。
お願いします。

Aベストアンサー

すみません。うっかりしてました。

document.write(FORM[v1]);
では、v1を変数と認識してしまうので、エラーになってしまいますね。

document.write(FORM.v1);  // 「FORM.v1」です
あるいは
document.write(FORM["v1"]);
としてください。

Qテーブル内の文字サイズを変更したい。

HTMLのテーブル内の文字サイズを変更したいのですが。
イマイチ上手くいかずに悩んでいます。
出来れば全体的に<TABLE></TABLE>のほうでいじれますか?
<TD>タグや<TR>タグのところでいじくるのですか?

Aベストアンサー

いろいろやり方はありますが
文字単位でサイズを変更するには
#2の方法ですね。

テーブルごとやセル(<TD>)ごとにサイズを変更するには
スタイルシート(CSS)を使用します。

テーブルごとにサイズを変更する場合
<TABLE style="font-size : 20px;">

セル(<TD>)ごとにサイズを変更する場合
<TD style="font-size : 20px;">あああ</TD>

#1の方法だとページ内の全てのセル(<TD>)に設定することになります。

スタイルシート(CSS)はこれら以外にも
いろいろな設定方法があります。

QCSSでreadonlyの機能はありますか?

ASPにてCSSを使用しています。
inputタグを読取専用(readonly)にしたいのですが、
スタイルシートでの指定の仕方がわかりません。
よろしくお願いします。

Aベストアンサー

> スタイルシートでも「IME-mode」の設定等、入力に関する制御も可能でしたので

それは某ブラウザが勝手に CSS を拡張して付けた機能で、本来の CSS ではそのようなことはできません。
CSS はあくまでも見た目つまりスタイルをデザインするためのものだと考えるべきです。

Qテーブルタグの中にdivを含めてはダメ?

テーブルタグの中にdiv要素を入れるとダメなのでしょうか?
何か不都合でもあるのでしょうか?
何かご存知の方がいれば教えていただけませんか?

Aベストアンサー

以下、HTML 4.01での話です。(XHTMLでもほぼ同じだと思います)

tableタグ直下に書けるのは、caption,col,colgroup,head,tfoot,tbodyと定義されています。
特定の条件下でtbodyが省略できますので、実際はtrも書けます。これら以外は書けないことになっています。
tr直下にはth,tdが書けることになっています(それ以外は不可)。

th,tdの下にはブロック要素が書けるので、divも書けます。

このように、テーブル内でth,tdの中以外でdivが使えないのはHTMLの仕様でそう決まっているからです。

Qテキストボックスに数字しか入力できないようにするには?

タイトルの通りなのですが、あるテキストボックスに数字しか入力できないようにしたいのですが可能でしょうか?また、

「あいうえお 12345 「」:・、¥・」

というような文字列をコピーし、そのテキストボックスにペーストした際にも数字の12345だけが残るといった事も実現したいのですが…

どなたかご存知の方いらっしゃいましたら教えて頂けると幸いです。

Aベストアンサー

>英数字

では、こんな感じで

<input type="text" onKeyup="this.value=this.value.replace(/[^0-9a-z]+/i,'')">

Q「関数が定義されていない」とのエラーが出る

こんにちは,よろしくお願いします。
何が何だか分からなくて困っています。
IEでは問題なく動くのに,Firefoxだと関数が定義されていないとのエラーが出ます。「<関数名> is not defined 」

スクリプトは,外部ファイル化してあります。キータイプの間違いもありません。何度も確認しました。

function aaa(){
 (スクリプト)
}

<body onload="aaa()">
のようにして呼び出しています。
いったい,何が悪いのでしょうか?

また,Operaだと,「リンク先のスクリプトを読み込むことができません」とのエラーが出ます。
元になるPHPファイルでは,
<script type="text/javascript" language="javascript" src="../javascript/AAAAA.js"></script>
のようにして呼び出しています。
もちろん,ファイルネームのタイプミスはありません。

ちなみに,スクリプトの内容は,日付関連のコードを記述しています。
試行錯誤している時に,他の日付関連のコードを実行したときに,
dayoption is not defined
というエラーが出たことがあります。
関数が存在しているのに,定義されていないと出るのは,もしかすると,日付関連の関数等の使い間違いではないかとも考えています。
使っているものは,Date()とgetYear()です。これらのうちのどちらかがFirefoxやOperaだとサポートされていないのでしょうか?

どうか御指導ください。よろしくお願いします。

こんにちは,よろしくお願いします。
何が何だか分からなくて困っています。
IEでは問題なく動くのに,Firefoxだと関数が定義されていないとのエラーが出ます。「<関数名> is not defined 」

スクリプトは,外部ファイル化してあります。キータイプの間違いもありません。何度も確認しました。

function aaa(){
 (スクリプト)
}

<body onload="aaa()">
のようにして呼び出しています。
いったい,何が悪いのでしょうか?

また,Operaだと,「リンク先のスクリプトを読み込むことが...続きを読む

Aベストアンサー

たぶんなんらかの凡ミスでしょうけど・・・・
firefoxでだめなら、firefoxのアドオンのfirebugで検証するのが一番です


人気Q&Aランキング