アプリ版：「スタンプのみでお礼する」機能のリリースについて

下記のようにクリックすると、サブメニュー現れるソースがあります。

解決済

  • 質問者：sapphirejp
  • 質問日時：
  • 回答数：1件

下記のようにクリックすると、サブメニュー現れるソースがあります。
エラーなく作動します。

＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
<SCRIPT LANGUAGE="JavaScript">
<!--
function startCateScrollScroll() {
setTimeout("slideCateScroll()", 10);
}
function slideCateScroll() {
var Sel_Height=65;
el = document.getElementById("scroll-list");
if (el.heightPos == null || (el.isDone && el.isOn == false)) {
el.isDone = false;
el.heightPos = 1;
el.heightTo = Sel_Height;
} else if (el.isDone && el.isOn){
el.isDone = false;
el.heightTo = 1;
}
if (Math.abs(el.heightTo - el.heightPos) > 1) {
el.heightPos += (el.heightTo - el.heightPos) / 10;
el.style.height = el.heightPos + "px";
startCateScrollScroll();
} else {
if (el.heightTo == Sel_Height) {
el.isOn = true;
} else {
el.isOn = false;
}
el.heightPos = el.heightTo;
el.style.height = el.heightPos + "px";
el.isDone = true;
}
}
//-->
</SCRIPT>

<a href=# onclick="slideCateScroll()"><small>大メニュー１</small></a>
<div id="scroll-list" class="scroll-list">
<li><a href="index1.php">小メニュー１</a><br>
<li><a href="index1.php">小メニュー２</a><br>
<li><a href="index1.php">小メニュー２</a><br>
</div>
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊

質問ですが、もしこのように二つ以上したい場合どうしたらいいでしょうか？

<a href=# onclick="slideCateScroll()"><small>大メニュー１</small></a>
<div id="scroll-list" class="scroll-list">
<li><a href="index1.php">小メニュー１１</a><br>
<li><a href="index1.php">小メニュー１２</a><br>
<li><a href="index1.php">小メニュー１３</a><br>
</div>

<a href=# onclick="slideCateScroll()"><small>大メニュー２</small></a>
<div id="scroll-list" class="scroll-list">
<li><a href="index1.php">小メニュー２１</a><br>
<li><a href="index1.php">小メニュー２２</a><br>
<li><a href="index1.php">小メニュー２３</a><br>
</div>

ご教授よろしくお願いします。

通報する

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

質問の本文を隠す

A 回答 (1件)

No.1ベストアンサー

  • 回答者： fujillin
  • 回答日時：

CSSが無いと動かないような気が…



1）一番簡単な方法は、名前やＩＤがダブらないようにして、同じものを2個セットする。
2）普通の方法だと、スクリプトを一般化して、複数対応可能なように修正する。


動作を確認していないので予定されている動作がわかっていませんが、こんなこと？
（jqueryを使用しています）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="ja">
<head><title>test</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4. …
<script type="text/javascript">
<!--
$(function(){
$("div.menu > div > ul").hide();
$("div.menu > div > a").click(function() {
$(this).next("ul:first").slideToggle();
});
});
//-->
</script>
</head>
<body>

<div class="menu">
<div>
<a href="#"><small>大メニュー１</small></a>
<ul>
<li><a href="index1.php">小メニュー１１</a></li>
<li><a href="index1.php">小メニュー１２</a></li>
<li><a href="index1.php">小メニュー１３</a></li>
</ul>
</div>

<div>
<a href="#"><small>大メニュー２</small></a>
<ul>
<li><a href="index1.php">小メニュー２１</a></li>
<li><a href="index1.php">小メニュー２２</a></li>
<li><a href="index1.php">小メニュー２３</a></li>
</ul>
</div>
</div>
</body>
</html>
    • good
    • 0
    • 件
通報する
この回答へのお礼

fujillin様
ご返答ありがとうございます。
このような方法もありますね！
勉強になりました。

通報する
お礼日時：2010/08/04 14:34

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

Q質問する（無料）

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

Q質問する（無料）

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

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

おすすめ情報