1

マウスホバーで完璧に機能するJS+CSSメニューがありますが、タッチデバイスのクリックでも機能するようにする必要があります。

メニューは次のようなものです。

<div id="menucontainer">
  <ul id="jsddm">              
    <li class="topmenu"><a href="#">Main Menu</a>
      <ul style="visibility: hidden;">
          <li><a href="http://www.google.com">Google</a></li>
          <li><a href="http://www.apple.com">Apple</a></li>
          <li><a href="http://www.microsoft.com">Microsoft</a></li>
      </ul>
    </li>        
  </ul>
</div>

そしてJS：

$(document).ready(function () {
    $('#jsddm > li').bind('mouseover', jsddm_open);
    $('#jsddm > li').bind('mouseout', jsddm_timer);

    // this work, but the submenus dont click
    $('.topmenu').bind('click', jsddm_open);
});

さまざまな方法を試しましたが成功しませんでした

Working sample here: http://jsfiddle.net/xjuZ4/

4

2 に答える 2

2

<a>タグにクリック ハンドラを配置します。クリック ハンドラーをトップ レベルのタグに配置することで、子タグをクリックすると親タグもクリックされるため、子タグ<li>のクリックをインターセプトします。<li><li><li>

e.stopPropagation();タグのクリック ハンドラーに追加して<a>、ホバー アウトがトリガーされないようにする必要があります。

また、JQuery メソッドを使用して、メソッドがトリガーされたときに存在.parent()する を見つけること<li>もできます。<a>click

複数のドロップダウン メニューでJSFiddleを更新しました。

于 2012-04-26T17:57:36.007 に答える
0

$('.topmenu').bind('click', jsddm_open);tag でリンクを呼び出すため、javascript で削除します<a>。

于 2013-02-10T14:01:58.370 に答える