전환이있는 다른 페이지로 연결

Question

양식이있는 페이지가 있습니다. 제출할 때 페이드 아웃하고 싶습니다. 페이지를로드 할 때 폼이 사라지기를 원합니다. 그래서 실제로 아약스를 시뮬레이트하고 페이지가 리디렉션되지 않는 것처럼 보이게 만듭니다.

이 작업을 수행하는 가장 좋은 방법은 무엇입니까?

Answer 1

페이드 아웃은 간단합니다. 사용자가 제출을 누르면 모든 콘텐츠가 사라지고 애니메이션이 끝나면 새 페이지를로드합니다. 그러나 새로운 페이지를 페이드하는 것은 문제입니다. 그런 식으로 애니메이션을 수행하려면 페이지를로드해야합니다. 그러나 나는 틀릴 수도 있습니다.

나는 당신에게 다소 해로운 해결책이 있습니다. 화면 가득한 컨테이너로 각 페이지를로드 할 수 있습니다. 예를 들어 배경색을 흰색으로 설정하면 화면이 완전히 흰색으로 렌더링됩니다. 문서가 준비되면 Jquery로 그 컨테이너를 사라지게 할뿐입니다. 이것은 내가 믿기를 원하는 방식으로 효과가 있어야한다. 내 머리에서

그래서 그냥 CSS 및 JQuery와

$(document).ready(function() 
{ 
    //Fade out container div 
    $("#overlay").animate({ 
      visibility: hidden; 
     }); 
}); 

function onSubmit() 
{ 
    e.preventDefault(); //Prevents the form from submitting. 

    $("#overlay").animate({ 
      visibility: visible; 
     }, 
     { 
      complete: function() 
      { 
       $("#form").submit(); 
      } 
     } 
}); 

중요한 물건을 애니메이션하는 많은 방법이 있습니다, 지침으로 받아! 사용자가 자바를 사용할 수 없게되면 아무 것도 볼 수 없습니다.