fadeIn() -이 조합 작업/

작동하지 왜이 CSS를 가지고 :fadeIn() -이 조합 작업/

.tracklistOff{display:none;} 
.tracklistOn{width:710px; float:left;} 
.trackon{width:710px; float:left;}

이 HTML : 이제

<div class="tracklistOff"> 
    <div class="trackon"> 
     ... somethings... 
    </div> 
</div>

,이 코드 :

$('.tracklistOff').find('.trackon').clone().fadeIn(600).insertAfter('.tracklistOn');

I fadeIn() 효과를 얻으십시오 (이상한 점은 trackon에 display:none; 속성이 없음). 이 코드

$('.tracklistOff').find('.trackon').clone().insertAfter('.tracklistOn').fadeIn(600);

fadeIn()

효과가 나타났다 아니다. 동일한 요소 fadeIn()에서 위치를 변경하는 것이 효과가있는 이유는 무엇입니까?

출처

2011-04-22 markzzz

는'tracklistOn' 케이스/자막 스크립트와 CSS에서 다른 .. 그 .. – niksvp

죄송 오 일치 시도, 복사 여기에 코드를 붙여 내가 그냥 잘못! 코드가 내 스크립트에 맞았습니다! – markzzz

fadeIn은 animate({ opacity: "show" })의 지름길입니다. 이 함수에는 현재 요소가 표시되는지 확인하는 조건이 있습니다. 요소가 이미 표시되어있는 경우이 함수는 아무 작업도 수행하지 않습니다.

따라서 코드의 문제는 fadeIn가 호출 될 때 함수가 아무것도하지 않는다, 그래서 fadeIn를 호출 할 때 첫 번째 예에서 .trackon 이미 대신 두 번째 .trackon에 보이지 볼 수없는 것입니다.

var working = $('.tracklistOff').find('.trackon').clone(); 
var notWorking = $('.tracklistOff').find('.trackon').clone().insertAfter('.tracklistOn'); 

console.log(working.is(':hidden')); // true 
console.log(notWorking.is(':hidden')); // false

출처

2011-04-22 12:41:09

어, 사실 복제 할 때 표시되어야합니다 (tracklistOff가 숨겨져 있고 trackon이 아닙니다). 아직 추가되지 않았기 때문에 표시되지 않을 수 있습니다! 나는 복제, 숨기기, 삽입 및 사라져야한다고 생각합니다. 어떻게 생각하십니까? – markzzz

예를 들어, .trackon은 숨겨진 요소의 자식이므로. : visible이 아닙니다. 보이는 요소를 복제하면 DOM 어딘가에 추가되지 않으므로 숨겨집니다. P –

'console.log ($ ('body'). is (': hidden'));/* false */ console.log ($ ('body') .clone(). ((: 숨김)));/* true * /' –

fadeIn() -이 조합 작업/

답변

관련 문제