Мой пользовательский код JQuery заставляет IE7 работать очень медленно, но не в других браузерах - PullRequest
0 голосов
/ 31 января 2011

Это мой первый вопрос на этом сайте, поэтому я заранее прошу прощения, если что-то звучит немного неопытно относительно правил (хотя я быстро прочитал их.)

В любом случае, по моей проблеме.

Я создал пользовательское меню в SharePoint 2010, которое использует UL и настраивается с помощью CSS и некоторого JQuery.

Это выглядит именно так, как я хочу, и отлично работает в 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');
    } 
  }
})

Я объясню, почему код существует, чтобы он помог вам немного лучше понять мои мысли.

Менюменю стиля вкладок с линией спуска.Когда вкладка из меню или один из ее дочерних элементов выбрана, вкладка поднимается, и элементы меню на выпадающей линии становятся видимыми.

Когда пользователь наводит курсор на другую вкладку меню, я установил JQuery для удаления текущеговыберите вкладку и скройте панель.

Я могу предоставить изображения, если это вообще поможет?

Любой указатель на то, почему это может произойти, очень ценится.

Спасибозаранее.

Рич

Ответы [ 3 ]

2 голосов
/ 31 января 2011

IE6 и IE7 имеют очень плохую производительность JavaScript в целом;IE8 (в 2 раза) лучше, но все еще далеко позади конкурентов.IE9 (бета) должен иметь такую ​​же или лучшую производительность JavaScript, как и его конкуренты.

Дополнительная проблема заключается в том, что IE (<= 8 в любом случае) не имеет <code>getElementsByClassName метода.Поэтому JQuery должен выполнять всю работу, когда вы предоставляете ему CSS-селектор на основе классов, и он не может полагаться на (быструю) встроенную функцию браузера.

Попробуйте оценивать селекторы узлов как можно меньше раз;если вы можете кешировать результирующий набор 'UL.SIDGlobalNav .LISIDCurrentSelected, UL.SIDGlobalNav .SIDCurrentSelectedParent' и выполнить в нем выборки, он должен работать намного быстрее.

0 голосов
/ 31 января 2011

Попробуйте это.

$("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');
    }
});

Я изменил первый выбор, чтобы он не смотрел на подпункт ul, что сводит на нет необходимость первого оператора if.

0 голосов
/ 31 января 2011

IE, как известно, имеет серьезные проблемы с кэшированием спрайтов. При возникновении этой проблемы замедления проверьте количество запросов HTTP, которые выдает браузер. может быть причиной того, что вы запускаете много запросов на получение изображений при каждом запуске jquery.

Если это не так, я могу помочь вам в оптимизации производительности, чтобы снизить затраты времени выполнения JavaScript.

...