2010-08-09 5 views
0

내가 함께 그룹 특정 div가 필요하고 순서를 변경하고 있었다면 모두를 애니메이션하는 것은 멋진 것입니다이 문제. 아래를 참조하십시오 :JQuery와 사업부 정렬 순서 =)

<div id="away">Some Content</div> 
<div id="online">Some Content</div> 
<div id="offline">Some Content</div> 
<div id="away">Some Content</div> 
<div id="online">Some Content</div> 
<div id="offline">Some Content</div> 
<div id="online">Some Content</div> 
<div id="online">Some Content</div> 
<div id="away">Some Content</div> 

그래서 내가 아이디의 함께 순서에 의해 그룹에 친절 필요 : 그래서 1.online 2.away 3.offline

:

<div id="online">Some Content</div> 
<div id="online">Some Content</div> 
<div id="online">Some Content</div> 
<div id="online">Some Content</div> 
<div id="away">Some Content</div> 
<div id="away">Some Content</div> 
<div id="away">Some Content</div> 
<div id="offline">Some Content</div> 
<div id="offline">Some Content</div> 

I (=이 하나 arround를 내 머리를 얻을 수없는 것. 나는이 사이트의 나머지 부분에 jQuery를 사용하고

을.

을 !

어떤 아이디어 =), 건배, 샘 T

+0

에있어 어떤 용기의 ctor에, 당신은 가능하다면 서버에서 올바른 순서를 생성해야합니다. –

답변

4

먼저, 그 ID를 제거하자 (ID가) 고유해야하며 다음과 같이 유효한 HTML에 대한 클래스를 사용

<div id="users"> 
    <div class="away">Some Content</div> 
    <div class="online">Some Content</div> 
    <div class="offline">Some Content</div> 
    <div class="away">Some Content</div> 
    <div class="online">Some Content</div> 
    <div class="offline">Some Content</div> 
    <div class="online">Some Content</div> 
    <div class="online">Some Content</div> 
    <div class="away">Some Content</div> 
</div> 

그럼 당신은 쉽게 다음과 같이 .appendTo()을 사용하여 정렬 할 수 있습니다 :

var statusOrder = ["online", "away", "offline"]; 
for(var i=0; i<statusOrder.length; i++) { 
    $("#users ." + statusOrder[i]).appendTo("#users")​​​​​​​​​​​​​​​​​​​​​​​; 
} 

You can give it a try here를,이 단지 실리를 사용하여 ...이 내용을 감싸 <div id="users"></div> 같은 간단한 컨테이너를 가정 나는 아래이 작업을 수행하는 방법을 보여 주었다 동안 그들이.

+0

OMG 나는 ID를 사용하지 못했습니다. 나는 ...... = 부끄러워합니다. =)이 덕분에 나중에 시험해 봅니다.). 이 사랑스러운 감사했다 –

+0

=) –

+0

@Sam - 이에 대한 답변이에 :) –