2

4 か月間問題なく動作した後、jQuery の垂直ドロップダウン メニューが突然表示されなくなりました。リンクしているjQueryバージョンの更新と関係があると思います。これは、ページの他の機能に必要ですhttp://code.jquery.com/jquery-latest.min.js。ページはこちらからご覧いただけます。

これは HTML の例です

<li><a href="#">Morocco</a>
<ul>
  <li><a href="?panel=0#morocco1">10 day Trek &amp; Camels </a></li>
  <li><a href="?panel=1#morocco2"> 14 day Trek &amp; Camels </a></li>
  <li><a href="?panel=2#morocco3">14 day Trek &amp; Service</a></li>
</ul>

これはjQuery/Javascriptです

<script type="text/javascript">
$(function () {
    $('#nav > li > ul')
        .hide()
        .click(function (e) {
        e.stopPropagation();
    });

    $('#nav > li').toggle(function () {
        $(this)
            .removeClass('waiting')
            .find('ul').slideDown();
    }, function () {
        $(this)
            .removeClass('waiting')
            .find('ul').slideUp();
    });

    $('#nav > li').hover(function () {
        $(this).addClass('waiting');
        setTimeout(function () {
            $('#nav .waiting')
                .click()
                .removeClass('waiting');
        }, 800);
    }, function () {
        $('#nav .waiting').removeClass('waiting');
    });
});
</script>

<script type="text/javascript">
$(document).ready(function () {
    $('#nav > li > a').eq(1).next().show();
});
</script>

これはCSSです：

}
#usexpeditionleftmenu {
width: 165px;
float: left;
background-color: #FFF;
margin-top: 15px;
padding-left: 12px;

    }
#nav {
float: left;
width: 155px;
border-top: 1px solid #999;
border-right: 1px solid #999;
border-left: 1px solid #999;

}
#nav li a {
display: block;
background: #d7d7d7;
border-top: 1px solid #d7d7d7;
border-bottom: 1px solid #afafaf;
text-decoration: none;
color: #EB5B00;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
padding-top: 1px;
padding-right: 2px;
padding-bottom: 2px;
padding-left: 5px;
}
ul#nav li ul li a {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #EB5B00;
}
#nav li a:hover, #nav li a.active {
color: #fff;
background-color: #8F8F8F;  
}
#nav li ul {
display: none; // used to hide sub-menus
}
#nav li ul li a {
background: #c1c1c1;
border-bottom: 1px dotted #ccc;
padding-top: 1px;
padding-right: 2px;
padding-bottom: 2px;
padding-left: 5px;

}

#nav, #nav ul, #nav li {list-style:none;}

問題がどこにあり、どのように解決するかについて、誰かが何かポインタを提供できれば、本当に感謝しています. 髪を引き裂いてきた！ありがとうございました。

4

1 に答える 1

1

ファンシーボックス プラグインは$.browser、最新の jQuery リリース ( 1.9 ) から削除された deprecated を利用しています。つまり、そのスクリプトでエラーが発生し、その機能が壊れています。

2 つの解決策があります。

  • jQuery 1.8.3 にダウングレードします。CDN は次の場所で入手できます (これらのいずれかを使用します)。

    http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js
http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.3.min.js
http://code.jquery.com/jquery-1.8.3.js

  • jQuery Migrate プラグインを使用して、古い非推奨の動作を復元します。こちらの情報を参照してください。非推奨の機能が使用されている場合にコンソール警告を出力する開発バージョンと、本番環境により適した別の縮小バージョンがあります。

http://code.jquery.com/jquery-latest.min.js余談ですが、将来何が変わるか予測できないため、実稼働環境では を使用しないでください。常にテスト済みの安定したバージョンの jQuery を使用してサイトを維持してください。

于 2013-01-20T23:40:28.287 に答える