jQuery를 사용하여 한 div를 다른 div로로드하는 방법

Question

여러 탐색 div를 클릭하면 다른 HTML 페이지에서 기본 페이지의 단일 컨테이너 div로 다른 내용이로드되는 메뉴를 만듭니다. fadeIn과 .fadeOut을 통합하여 단순히 전환하는 대신 내용이 교차 페이드되도록하고 싶습니다. 내가 jQuery를 함께 작업에 새로운 오전으로

$(function() { 
$(".navIcon1") .click(function(){ 
    $("#container").load("content.html #div1"); 

$(".navIcon2") .click(function(){ 
    $("#container").load("content.html #div2"); 
}); 
}); 
}); 

, 내가 포함하기 위해 변수를 생성하는 방법을 확실하지 오전 : 여기

나는이 두 탐색 된 div에서 내용을로드 쓴 스크립트입니다. fadeIn 및 .fadeOut 현재 작동하고 있습니다.

미리 감사드립니다.

Answer 1

컨테이너를 먼저 숨긴 다음 페이지로드 후 페이드 인합니다.

$("#container").hide().load("content.html #div1", function(){ 
    $("#container").fadeIn(5000); 
}); 

Answer 2

이연 객체는 여기에 핵심적인 역할을 할 수 있습니다 여전히 페이드 아웃 및 fadeIn 애니메이션을하면서

var req = $.get("content.html"); 

$("#container").fadeOut("1000",function(){ 
    req.done(function(html){ 
     $("#container").html(
      // $.parseHTML prevents a memory leak 
      $($.parseHTML(html)).find("#div1").addBack().filter("#div1"); 
     ).fadeIn("1000"); 
    }); 
}); 

이 당신이 가능한 한 빨리 내용을 검색 할 수있다.