페이드 효과가 있는 요소 추가 [jQuery]

페이드 효과가 있는 요소 추가 [jQuery]

var html = "<div id='blah'>Hello stuff here</div>"

$("#mycontent").append(html).fadeIn(999);

이거 안 되는 것 같아요.

내용이 추가될 때 시원한 효과를 바랄 뿐입니다.

참고: 나는 "내 콘텐츠" 전체가 아니라 새로운 "블라" 디브만 희미해지길 원합니다.

$(html).hide().appendTo("#mycontent").fadeIn(1000);

정보를 조금 더 추가합니다.

jQuery는 메소드 호출을 동일한 요소에 연결할 수 있는 "메소드 체인"을 구현합니다.첫 번째 경우:

$("#mycontent").append(html).fadeIn(999);

당신은 그것을 적용하게 될 것입니다.fadeIn메서드 체인의 대상이 되는 개체에 호출합니다. 이 경우#mycontent. 당신이 원하는 것이 아닙니다.

@icktoofay의 (great) 답변에는 다음과 같은 내용이 있습니다.

$(html).hide().appendTo("#mycontent").fadeIn(1000);

이것은 기본적으로 다음과 같은 의미입니다.html, 기본적으로 숨김으로 설정하여 에 추가합니다.#mycontent그 다음에 빛을 바랬습니다.지금 메소드 체인의 타겟은hmtl대신에#mycontent.

이것도 효과가 있습니다.

$(Your_html).appendTo(".target").hide().fadeIn(300);

안부 전해요

페이드인은 숨김에서 표시로 전환되는 것이므로 추가할 때 "html" 요소를 숨기고 표시해야 합니다.

var html = "<div id='blah'>Hello stuff here</div>"

$("#mycontent").append(function(){
  return html.hide();
});

$('#blah').fadeIn(999);

언급URL : https://stackoverflow.com/questions/4687579/append-an-element-with-fade-in-effect-jquery