0

私はこのサイトのナビゲーションに jQuery ドロップメニューを使用しています。http://184.173.208.195/~secoast/これは明らかに開発中です。.dropmenu は関数ではないという jQuery エラーが表示されても、ドロップ メニューは正しく機能します。

現在の主な問題は、メニューがページ上の他のコンテンツの後ろに隠れていることです。これは、jQuery エラーの一部が原因であると思われます。dropmenu モジュールには、他のライブラリ モジュールと競合しないように、もともと noconflict 部分が含まれていました。

すべてのベースをカバーするために、ここに jQuery ファイル (jquery.dropmenu.js) の冒頭を示します。

$.fn.dropmenu = function(custom) {

    // Default plugin settings
    var defaults = {
      openAnimation: "size",
        closeAnimation: "slide",
        openClick: false,
        openSpeed: 300,
        closeSpeed: 200,
        closeDelay: 200,
        onHide: function(){},
        onHidden: function(){},
        onShow: function(){},
        onShown: function(){},
        zindex: 100,
        openMenuClass: 'open',
        autoAddArrowElements: true
    };

次に、メインファイルに次のコードがあります。

<script>
$(document).ready(function(){
    $("#nav-one").dropmenu({
            openAnimation: "size",
            closeAnimation: "slide",
            openSpeed: 300,
            closeSpeed: 200,
            closeDelay: 500,
            zindex: 1000
    });
});
</script>

最後に、ナビゲーション メニューを次に示します。

<ul id="nav-one" class="dropmenu css-only">
  <li><a href="#">About Us</a>
    <ul>
          <li><a href="#">Support</a></li>
          <li><a href="#">Help</a></li>
          <li><a href="#">Examples</a></li>
          <li><a href="#">Your work</a></li>
        </ul>
  </li>
  <li> 
    <a href="#">Why the Southeast</a>
    <ul>
      <li><a href="#">Support</a></li>
      <li><a href="#">Help</a></li>
      <li><a href="#">Examples</a></li>
      <li><a href="#">Your work</a></li>
    </ul>
  </li>
  <li> 
    <a href="#">What We Do</a>
    <ul>
      <li><a href="#">Tools</a></li>
      <li><a href="#">Office</a></li>
      <li><a href="#">Custom projects</a></li>
    </ul>
  </li>
  <li> 
    <a href="#">Resources</a></li>
</ul>

これを整理するための助けをいただければ幸いです。

ありがとう。

4

3 に答える 3

1

とasで.dropdownクラスを拡張してみてください。position: relative;z-index: 100;

.dropmenu {
  float: left;
  margin: 50px 0 0 60px;
  padding: 0px;
  border-right: none;
  position: relative;
  z-index: 100;
}

また、エラーに気づきました。" Uncaught TypeError: Object [object Object] has no method 'dropmenu' ".

于 2013-01-25T21:53:08.697 に答える
0

z-index非常に高い数を使用して、すべての上に要素を作成するために使用する必要があります。

これがスクリーンショットです：

スクリーンショット

ご覧のとおり、スタイルを変更しただけです。z-index: 9005

于 2013-01-25T22:01:03.007 に答える
0

他のことを試す前に、次のように変更することをお勧めします。

<script type="text/javascript" src="../js/jquery.dropmenu.js"></script>

に：

<script type="text/javascript" src="js/jquery.dropmenu.js"></script>

削除されたことに注意し../てください。間違いなく小さなミスですが、非常に重要です;)

于 2013-01-25T21:58:55.963 に答える