最新閲覧日:

はじめまして。
フレームのコンテンツ表示を下のURLのように
+や-を押して、パカッて開いたり閉じたりできないでしょうか?
http://www.jp.uo.com/
可能ならどこかサンプルなどサイトをご存知ではないでしょうか?
ぜひ教えて下さい。お願いします。

A 回答 (2件)

こんにちはyanbouさん、xruzです。


こんな感じでしょうか?(動作確認:Ie5.5sp2のみ)

<html>
<head>
<title>プルダウンメニュー</title>
<script language="javascript">
<!--
var isMenu = "hidden";
function onmenu(mnu,submenu,x,y)
{
document.all(submenu).style.visibility=isMenu=(isMenu=='hidden')?'visible':'hidden';
mnu.innerText=(isMenu=='hidden')?'+':'-';
document.all('div2').style.top=(document.all('menu1').innerText=='-')?116+18*3:116;
}
// -->
</script>
</head>
<body bgcolor="azure" style="font-size:16px">
<div id='div1' style="position:absolute; left:10; top:100; width:200;">
<a id="menu1" href="#" onClick="onmenu(this,'menu11');return false">+</a>LINK1
<div id="menu11" style="position:absolute; left:-2; top:16; visibility:hidden;">
<tt>
├<a href="http://www.goo.ne.jp/" target='mainframes'>Goo Japan</a><br>
├<a href="http://www.msn.co.jp/" target='mainframes'>MSN Japan</a><br>
└<a href="http://www.ibm.co.jp/" target='mainframes'>IBM Japan</a><br>
</tt>
</div>
</div>
<div id='div2' style="position:absolute; left:10; top:116; width:200;">
<a id="menu2" href="#" onClick="onmenu(this,'menu21');return false">+</a>LINK2
<div id="menu21" style="position:absolute; left:-2; top:16; visibility:hidden;">
<tt>
├<a href="http://www.goo.ne.jp/" target='mainframes'>Goo Japan</a><br>
├<a href="http://www.msn.co.jp/" target='mainframes'>MSN Japan</a><br>
└<a href="http://www.ibm.co.jp/" target='mainframes'>IBM Japan</a><br>
</tt>
</div>
</div>
</body>
</html>

がんばってくださいね。
    • good
    • 0
この回答へのお礼

xruzさん、ありがとうございました。
こんなのがほしかったです。
サンプルまで頂いてすいませんでした。
頑張ります!!(^-^)

お礼日時:2001/10/30 10:30

始めまして、単刀直入に言うと出来ます。


但し、URLのページの+や-は「Jpg」つまり絵なので、その絵を用意しなければ無理です。
文字のみでのと言うことでしたら、簡単に出来ます。
サンプルを乗せておきますので宜しければどうぞ。

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS">
<META NAME="GENERATOR" CONTENT="Oracle JDeveloper">
<TITLE>タイトル</TITLE>
</HEAD>
<script language="JavaScript">
<!--
function Menu (one, two) {
if (one.style.display == 'none') {
one.style.display='';
}
else {
one.style.display='none';
}
}
-->
</script>
<BODY>
<DIV onClick="Menu(tree1, MENU1)">
<SPAN ID="MENU1" CLASS="title">
<a title="onMouseされた時の表示する文字" target="ContentsFrame">見せておく文字</a>
</SPAN>
</DIV>
<DIV ID="tree1" STYLE="display:none;">
<UL>
<LI><A HREF="表示させるhtmlのURL" target="Frame名">リスト1</A><BR>
<LI><A HREF="表示させるhtmlのURL" target="Frame名">リスト2</A><BR>
<LI><A HREF="表示させるhtmlのURL" target="Frame名">リスト3</A><BR>
</UL>
</DIV>
</BODY>
</HTML>

補足しますと、ツリー表示させたい下の部分をDIVタグでくくり
STYLE="display:none;"でディスプレイから見えないように隠しています。
DIVタグで文字をくくりonclikでjavaScriptに飛びツリー表示の下部部分を表示させるようにしています。
メニューを増加させる場合は
<SPAN ID="MENU1" CLASS="title">
のID="MENU1"をID="MENU2"と言うようにし
<DIV ID="tree1" STYLE="display:none;">の
ID="tree1"をID="tree2"等とし増やせばOKです。

宜しければ参考にして下さい。
    • good
    • 0
この回答へのお礼

kaji_0131ありがとうございました。
増やし方も乗せてくださっていましたから
わかりやすかったので助かりました。
参考に作成をしてみます!!

お礼日時:2001/10/30 11:05

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


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

おすすめ情報

カテゴリ