jQuery clean slideToggle для множества элементов одновременно - PullRequest
Новая
       21

jQuery clean slideToggle для множества элементов одновременно

0 голосов
/ 17 февраля 2010

Я использую технику slideToggle, чтобы показать и скрыть более 100 DIV с полной информацией в моем приложении. У меня есть кнопки «Показать все» и «Скрыть все», и я бы хотел, чтобы они также имели анимацию slideToggle (вместо того, чтобы просто показывать и скрывать все). Однако в IE6 slideToggle работает очень медленно при применении к каждому элементу.

Кто-нибудь знает, как это ускорить? Кроме того, я переключаю значки, которые находятся в msg_head, но это не замедляет его. Если я удаляю th slideToggle и заменяю его просто показом / скрытием (на показе все / скрыть все), это работает нормально. Однако я бы хотел, чтобы анимация была возможной. 

<p class="msg_head" onclick="toggleSelection($(this));">Heading</p>
<div class="msg_body">
   content
</div>

А мой покажет все и скроет все функции ... 

function toggleSelection(element) {
    element.next("msg_body").slideToggle(250);
    element.find(":first-child").toggleClass("ui-icon-circle-arrow-s");
    element.find(":first-child").toggleClass("ui-icon-circle-arrow-e");
}

function showall() {
    $(".msg_head").each(function() {
      $(this).next(".msg_body:hidden").slideToggle(250);
      $(this).find(":first-child").attr('class','ui-icon ui-icon-circle-arrow-s');
    });
}

function hideall() {
    $(".msg_head").each(function() {
      $(this).next(".msg_body:visible").slideToggle(250);
      $(this).find(":first-child").attr('class','ui-icon ui-icon-circle-arrow-e');
    });
}

Для записи, отдельная функция toggleSection () работает безупречно. И замена slideToggle в функциях showall и hideall тоже хорошо работает. Я просто смотрю, есть ли способ получить анимацию slideToggle, чтобы она не заглушалась.

Ответы [ 2 ]

0 голосов
/ 17 февраля 2010

Это не сильно поможет, но мне нужно просто сказать «Нет». Одновременная анимация 100+ DIV кажется немного сложной, но вы можете избежать неприятностей, когда посетитель запускает современный браузер на приличной машине. Но если вы хотите ускорить это, в частности, в IE6 ... вы мало что можете сделать. Браузер древний, включая движок рендеринга javascript, и никогда не сможет делать то, что вы от него хотите, пока выглядит гладко и красиво.

0 голосов
/ 17 февраля 2010

Какую версию jQuery вы используете? Если вы не используете последнюю версию (1.4.1), я настоятельно рекомендую обновить ее. Разработчики jQuery серьезно обновили производительность для последней версии, чтобы решить проблемы, подобные описанной выше. Вот ссылка на примечания к выпуску для получения дополнительной информации: http://jquery14.com/day-01/jquery-14

...