0

これはこのサイトでの初めての質問なので、ルールに関して少し不慣れに聞こえる場合は、事前にお詫び申し上げます (ただし、すぐに読みました)。

とにかく私の問題に。

UL を使用し、CSS といくつかの JQuery を介してカスタマイズされた SharePoint 2010 でカスタム メニューを作成しました。

それはまさに私が望むように見え、IE8、FF、および Chrome で優れたパフォーマンスを発揮します。ここにある古い遅いマシンでテストしましたが、問題なく動作します。

IE7 がインストールされているマシンでこれをテストすると、問題が発生します。何らかの理由で、トップ メニュー項目にカーソルを合わせると、動作が非常に遅くなります。

私は (先週) JQuery を学び始めたばかりなので、自分のコードで何か完全に間違ったことをしたと思います。

次のコードによって遅くなります。

$("ul.SIDGlobalNav li:not(ul.SIDGlobalNav li ul li)").mouseenter(function() {
  if ($(this).is(':not(.LISIDCurrentSelected, .SIDCurrentSelectedParent)'))
  {
    $("UL.SIDGlobalNav .LISIDCurrentSelected div, UL.SIDGlobalNav  SIDCurrentSelectedParent div").css('backgroundPosition', 'left top');
    $("UL.SIDGlobalNav .LISIDCurrentSelected div a, UL.SIDGlobalNav .SIDCurrentSelectedParent div a").css('backgroundPosition', 'right top').addClass('tabdown');
    if ($(this).children('ul').length < 1)
    {
      $("UL.SIDGlobalNav .LISIDCurrentSelected ul, UL.SIDGlobalNav .SIDCurrentSelectedParent  ul").css('visibility', 'hidden');
    } 
  }
})

私の考えをもう少し理解するのに役立つように、コードが存在する理由を説明します。

メニューは、ドロップライン付きのタブ スタイルのメニューです。メニューまたはその子の 1 つからタブが選択されると、タブが持ち上げられ、ドロップラインのメニュー項目が表示されます。

ユーザーが別のメニュー タブにカーソルを合わせると、現在選択されているタブをドロップしてドロップバーを非表示にするように JQuery を設定しました。

これが少しでも役立つ場合は、画像を提供できますか?

なぜそれが起こっているのかについての指針は非常に高く評価されています。

前もって感謝します。

リッチ

4

3 に答える 3

2

IE6 と IE7 は全体的に JavaScript のパフォーマンスが非常に悪いです。IE8 は (2 倍) 優れていますが、それでも競合他社に大きく遅れをとっています。IE9(ベータ版) は、競合他社と同等かそれ以上の JavaScript パフォーマンスを備えているはずです。

getElementsByClassName追加の問題は、IE (とにかく <= 8) にはメソッドがないことです。したがって、JQuery は、クラス ベースの CSS セレクターを指定するときにすべての作業を行う必要があり、(迅速な) ネイティブ ブラウザー機能に依存することはできません。

ノード セレクターの評価回数はできるだけ少なくしてください。'UL.SIDGlobalNav .LISIDCurrentSelected, UL.SIDGlobalNav .SIDCurrentSelectedParent'結果セットをキャッシュして、それに対してサブセレクションを行うことができれば、実行速度が大幅に向上するはずです。

于 2011-01-31T17:34:39.307 に答える
0

これを試してみてください。

$("ul.SIDGlobalNav > li:not(.LISIDCurrentSelected, .SIDCurrentSelectedParent)").mouseenter(function(){
    $("UL.SIDGlobalNav .LISIDCurrentSelected div, UL.SIDGlobalNav .SIDCurrentSelectedParent div").css('backgroundPosition', 'left top');
    $("UL.SIDGlobalNav .LISIDCurrentSelected div a, UL.SIDGlobalNav .SIDCurrentSelectedParent div a").css('backgroundPosition', 'right top').addClass('tabdown');

    if ($(this).children('ul').length < 1)
    {
        $("UL.SIDGlobalNav .LISIDCurrentSelected ul, UL.SIDGlobalNav .SIDCurrentSelectedParent  ul").css('visibility', 'hidden');
    }
});

最初の select を変更して、 sub を調べないようにしましたul。これにより、最初の if ステートメントの必要性がなくなります。

于 2011-01-31T17:21:32.743 に答える
0

IE には、スプライトに関する深刻なキャッシングの問題があることが知られています。この速度低下の問題が発生した場合は、ブラウザーによって発行されている HTTP 要求の数を調べてください。jquery を実行するたびに、画像を取得するために多くのリクエストを送信している場合があります。

そうでない場合は、パフォーマンスの最適化を行って JavaScript ランタイムの費用を削減するお手伝いをします。

于 2011-01-31T17:17:52.393 に答える