DIV 애니메이션 페이드 인

/* Sliding Gallery panels */ 
$(function() { 
$(".down_link").click(function() { 
    var file = $(this).attr('data-file'); 
$(".load_space").load(file, function() { 
    //Insert contents of file wherever 
    $(".gallery_block2").stop(true, true).animate({ marginTop: 0 }, 400).fadeTo(500,1).show(); 
}); 
});  
$(".up_link").click(function() { 
    $(".gallery_block2").stop(true, true).fadeTo(500,0).show().animate({ marginTop: -550 }, 400); 
}); 
});

위의 코드는 썸네일 ("down_link")을 클릭하면 DIV ("gallery_block2")가보기로 움직입니다. DIV는 파일을 호출하고로드합니다. 그런 다음 해고 ("up_link")하고 다시 움직일 수 있습니다. 이 부분은 완벽하게 작동합니다.DIV 애니메이션 페이드 인

애니메이션을 페이드 인/페이드 아웃하여 더 매끄럽게 만들었습니다. 그러나 파일에서 처음 슬라이드 할 때 이미 콘텐츠가로드되어 있습니다. 페이드 인하지 않습니다. 닫을 때 사라지고 다음에 사라질 때 사라집니다. 그래서 그것은 적절히 희미 해지지 않는 첫 번째 기회 일뿐입니다.

해결 방법에 대한 제안 사항이 있으십니까?

출처

2012-02-09 Andy

좋아, 난 내 자신의 질문에 대답 할 수 있습니다. DIV가 숨겨 지도록 CSS를 변경해야합니다. 숨겨진 것이 아니기 때문에 이미 표시되어 있습니다. 도. – Andy

페이드 인이 제대로 작동하려면 처음에는 style="display:none"이 숨겨져 있어야합니다. 애니메이션을 시작하기 전에 hide() 호출을 추가 할 수 있습니다.

출처

2012-02-09 21:28:04

그래, 나는 바보 야. 나는 게시 후 약 2 분을 깨달았다 !! 숨기기() 팁도 가져 주셔서 감사합니다. – Andy

문제가 없는데 때로는 상황이 중간에있을 때보기가 어렵습니다. :) –

.stop(true, true) 추가 숨기기() 후 :

.stop(true, true).hide() ...

출처

2012-02-09 21:33:27 j08691

DIV 애니메이션 페이드 인

답변

관련 문제