jquery로 페이지 전환

페이지 사이에 전환을 만들어야합니다. 나는 이런 식으로했습니다 : 리디렉션에jquery로 페이지 전환

$("div.fading").css('display', 'none'); 
    $("div.fading").fadeIn(500); 
    $("a.fade").click(function(event){ 
     event.preventDefault(); 
     link = event.href; 
     $("div.fading").fadeOut(500, redirect(link)); 
    });

내가에서는 window.location 사용이를하며 일하고있다,하지만 fadeIn 효과가로드 된 모든 페이지에 대해 실행되었습니다. 나는 그것을 좋아하지 않았기 때문에 아약스로 만들려고 노력하고있다. jQuery에서 콜백 함수로 fadeIn 함수를 호출 할 수 있어야합니다. 나는이 코드를 가지고, 내가 fadeIn 후 얻을

$(".fading").click(function(event){ 
    event.preventDefault(); 
    var link = this.href; 
    $(".fade").fadeOut(300, function(){ 
     $.ajax({ 
      url: link, 
      success: function(){ 
       $(".fade").fadeIn(300); 
      } 
     }); 
    });

완전히 working..All 효과가 확인되어 있지 않습니다

하지만 페이지가 내가 .load으로 다른 방법을 수행 할 수 있습니다 단순히 out..IMHO 퇴색이 동일() 함수를 구현하려고했지만 너무 많은 문제가 있습니다 :-) 아무도 내가 제대로 작동하도록해야한다는 것을 알고 있습니까? 감사합니다 ..

출처

2010-08-23 simekadam

아약스를 통해 페이지를 호출하고 있지만 fadeIn()에 전화하기 전에 현재 .fade div의 내용을 대체하지 않습니다. 아래 코드를 수정했습니다. .load() 같은 일을 조금 더 깨끗하게해야합니다.

$(".fading").click(function(event){ 
    event.preventDefault(); 
    var link = this.href; 
    $(".fade").fadeOut(300, function(){ 
     $.ajax({ 
      url: link, 
      success: function(pageHTML){ 
       $(".fade").html(pageHTML); 
       $(".fade").fadeIn(300); 
      } 
     }); 
    });

출처

2010-08-23 11:16:47 sjobe

그래, 괜찮아 보이지만 페이지의 전체 코드를 대체해야하고 그것을 선택하는 방법을 모르겠다. 내가 DOM 선택기로 창을 사용하면 작동하지 않는다. HTML을 사용할 때, 그것은 스타일 시트 등을로드하지 않습니다. 이것은 정확하게 .load() 함수를 가지고있는 문제입니다. – simekadam

.load()는 CSS ID 선택기를 사용하여 페이지 조각을로드하게합니다. ajax를 통해 콘텐츠를 얻을 때 iframe을 사용하거나 인라인 CSS를 사용하거나 CSS 가져 오기를 사용하는 것이 좋습니다. 페이지에 CSS 스타일을 추가하여 새 내용을로드 할 때 모든 내용이 올바르게 표시되도록 할 수도 있습니다. – sjobe

안녕하세요, 귀하의 조언을 주셔서 감사합니다, 나는 CSS는 @ 수입 기능을 시도했지만, 불행히도 그것은 성공하지 못했습니다. 얻은 데이터를 조각으로 가져 와서 변경된 섹션 (제목, 본문, ..) 만 바꾸려고합니다. 좋은 방법이라고 생각합니다 :-) – simekadam

나는 당신이 방금 반환 된 데이터를 사용하지 않고 있다고 생각합니다. 성공 함수에서 다음과 같이해야합니다.

$('.fade').html(data);

그런 다음 페이지가 업데이트 된 후에 페이드 인 할 수 있습니다.

출처

2010-08-23 11:19:47 Timbo

jquery로 페이지 전환

답변

관련 문제