2010-02-17 5 views
0

slideToggle 기술을 사용하여 응용 프로그램에 100 가지 이상의 정보를 표시하고 숨 깁니다. "모두 표시"및 "모두 숨기기"버튼이 있으며 슬라이드 쇼글 애니메이션을 표시하고 싶습니다 (모든 표시 및 숨기기 대신에). 그러나 IE6에서는 slideToggle이 각 요소에 적용될 때 실제로 느리게 실행됩니다.많은 요소에 대한 jQuery clean slide 토글

누구나 속도를 높이는 방법을 알고 있습니까? 또한 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() 함수는 완벽하게 수행합니다. 그리고 showall과 hideall 함수로 slideToggle을 대체하면 show와 hide도 잘 작동합니다. 슬라이드가 보이지 않고 slideToggle 애니메이션을 얻을 수있는 방법이 있는지 정말 고민 중입니다.

답변

0

이것은 많은 도움이되지는 않지만 여기서는 간단한 "아니오"로 가야 할 것입니다. 100+ DIV를 동시에 애니메이션하는 것은 약간은 보이지만 방문객이 적절한 브라우저에서 최신 브라우저를 실행하면 그걸로 도망 갈 수 있습니다. 그러나 IE6에서 속도를 향상 시키려고한다면 ... 할 수있는 일이별로 없습니다. 브라우저는 자바 스크립트 렌더링 엔진을 포함하여 고대이며, 부드럽고 예쁘게 보면서 원하는 것을 할 수 없습니다.

+0

그래, 나는 동의해야 할 것입니다. 나는이 것을 포기했다. – macca1

0

어떤 jQuery 버전을 사용하고 있습니까? 최신 (1.4.1)을 사용하고 있지 않다면 업그레이드를 적극 권장합니다. jQuery 개발자는 위에서 설명한 것과 같은 문제를 해결하기 위해 최신 버전의 주요 성능을 ​​정밀 검사했습니다. 다음은 더 많은 정보를위한 릴리즈 노트 링크입니다. http://jquery14.com/day-01/jquery-14