0

メニューボタンにカーソルを合わせる(またはマウスオーバーする)と、サブメニューがドロップダウンとして表示されるようにするスクリプトを作成しています。if条件でthis.id="menutoggle1"を参照し、それがtrueかfalseかを確認しました。

trueの場合、ステートメントを使用して関数を起動する必要があります

document.getElementById("submenu1").style.display="inherit";

動作しませんが、これは私のif条件と関係があると思います。状況はよくわかりませんが、なぜこれが間違っているのかを誰かに説明してもらい、修正を手伝ってもらえるといいのですが。

これは私のコードです。

function submenu_show()
{
  if(this.id="menutoggle1" == true)
  {
    document.getElementById("submenu1").style.display="inherit";
  }
}

希望する結果を達成する別の方法を知っていますが、サブメニューがあるはずのすべてのメニューオプションについて、表示する2つの関数と非表示にする2つの関数を作成する必要があります。

編集:私は自分の考えを完全に落とさずにそれを機能させることはできないと思ったので、私は他の選択肢を選びました。また、適切に記述されていれば、それはそれほど面倒ではないことにも気づきました(結局、いくつかのドロップダウンに使用されることになっています)。

これが私が最終的に使用したコードです。

<div id="menubutton1" onmouseover="submenu1_show();" onmouseout="submenu1_hide();"></div>
<div id="submenu1" onmouseover="submenu1_show();" onmouseout="submenu1_hide();"></div>

function submenu1_show()
{document.getElementById("submenu1").style.display="inherit";}
function submenu1_hide()
{document.getElementById("submenu1").style.display="none";}
4

2 に答える 2

0

jQueryを使用してこれを行ってみませんか?CSSとjQueryを少し編集するだけで、スライド効果やフェード効果などの利点を活用できます。jQueryでドロップダウンがいかに簡単か見てみましょう。

$('nav ul li a').hover(
    function() {
        $('nav ul li ul').addClass('over');
    },
    function() {
    $('nav ul li ul').removeClass('over');
    }
);

これが実際のデモです。私はそれがあなたの質問に答えないことを知っています、しかし私はこれがあなたを少し助けることを願っています!

于 2013-01-06T21:35:14.563 に答える
0

現在のコードでは、これは厄介です。それは確かに要素のIDではありません。関数内に要素を見つけることができます。

function fnName(){
     var el = document.getElementById("...");
     if(el.id === "something"){ ... }
}

特定のIDに対してこれを実行する関数を取得する場合は、fnName関数にパラメーターを追加し、そのパラメーターをdoc.getElByID関​​数に渡すことができます。

于 2013-01-06T21:26:19.770 に答える