2012-01-26 1 views
7

이 내 코드입니다 이 일을하는 다른 방법?JQuery와 .hide() fadeIn()는

+2

의 불투명도를 가진 첨가되어이 방법을 설정? 일단 그것이 숨겨지면 당신은 다시 그것을 보여줄 때까지 숨어 있어야합니다. – danwellman

+0

아 .. 내 .. .. 오타가 .. 질문을 편집 할거야! – Mackelito

+0

페이지가로드 될 때 (그리고 아마도 ajax 호출을 통해 업데이트 될 때) ".items"요소가 보이나요? 방금 업데이트 한 비트에주의를 끌기 위해 숨기기 및 페이드 인 아이디어가 있습니까? HTML을 교체하고 사업부를 강조 표시의 변경 ... 추가을 보여주는 - – nnnnnn

답변

17

당신은 당신이를 유지하려면 대신하는 경우 불투명도를 사용하여 수 요소 치수 그대로 :

$('.items').html(response).css({'opacity':0}).animate({'opacity':1}); 
+0

깨끗하고 단순한 .. 지금 왜 그렇게 생각하지 않았습니까? ;) 고마워! – Mackelito

+0

문제는 없습니다. :) –

+1

이것도 작동한다는 것을 알았습니다 ... 다른 하나는 더 빠릅니까? $ (응답) .hide(). appendTo (ajaxElement) .fadeIn(); 나는 속도가 다를 것이라고 생각하지 않습니다 – Mackelito

4

숨기기 다음 CSS를 사용하여 필요시에 페이드 :

CSS :

.items { 
    display:none; 
} 

자바 스크립트

$('.items').html(response).fadeIn();

+0

문제 미안 그냥 다른 옵션의 몇 가지있다 – Mackelito

+0

필터링하는 것을 페이지로드가 보여주는 항목이있다 ... 이것은 아약스 응답이라는 것이다 div를 누르고 이전 div를 슬라이드 한 다음 새 div를 위로 올리거나 .... 또는 fadeOut()/fadeIn()? – ManseUK

0

당신은 기존의 내용과 새 사이의 부드러운 트란 지션을 표시 할 경우, 다음을 시도해보십시오 : 그것은 신속하게 가지는 요소의 깜박이는 효과를 방지 처음 추가 된 이후

$(function(){ 
    $('.items').fadeOut(function(){ 
     $(this).html(response).fadeIn(); 
    }) 
}); 
1

이는 청소기 솔루션입니다 불투명도 0

에 두 번 숨기기()를 가지고 왜 ELEM 이미 0

var elem = $(response).css({'opacity': 0}); 
$('.items').html(elem); 
elem.animate({'opacity': 1});