2011-10-28 1 views
0

나는 이미지를로드하고 내용을 #content div에로드하는 것을 보여주는 js 스크립트가 있습니다. 잘 동작하지만 일단로드되면 콘텐츠가 사라 지도록 만드는 방법을 알아낼 수 없습니까? .load("inc/home.php"); 완료, 나는 3 초 지속 시간/home.php 파일 Inc.의 내용에 페이드 싶습니다 예를 들어다음 js 스크립트에 페이드 인 효과를 추가하는 방법은 무엇입니까?

function viewHome(){ 
    $('#woodheader').load("inc/home.php"); 
    $('#content').html('<span class="loader">Loading..&nbsp;&nbsp;&nbsp;<img class="loaderimg" src="images/ajax_loader.gif"/></span>').load("inc/home.php"); 
} 

. 내가 어떻게 해? 0 CSS에서 : jQuery로

+0

두 개의 다른 요소에'.load ("inc/home.php")를 호출하고 있습니다. 그게 의도적 인거야? 두 요소에서 페이드 효과를 원하십니까? – gilly3

+0

yes that is intentional))) – Ilja

답변

3
function viewHome() { 
    $('#woodheader').load("inc/home.php"); 
    var content = $('#content'); 
    content.html('<span class="loader">Loading..&nbsp;&nbsp;&nbsp;" + 
     "<img class="loaderimg" src="images/ajax_loader.gif"/></span>'); 
    content.load("inc/home.php", function() { 
     content.hide().fadeIn(3000); 
    }); 
} 
+1

개인적으로 선호하는 점은 jQuery 객체 인 변수에'$'를 추가하는 것을 좋아한다. 'var $ content = $ ('content');와 같이 - 최고의 답을 얻기 위해 upvoted. – HurnsMobile

+0

일종의 헝가리 표기법. 그것은 아마도 좋은 습관이지만, 아직 그것을 개인적으로 채택하지 않았습니다 ... 우리는 보겠습니다. :-) – gilly3

0

은 JQuery와 기능을

$("#element").fadeIn(350); 
+0

예,하지만 jquery를 "fade"라고 부르는 방법을 모릅니다. 일단 내가 코드를 $ (문서)에 넣으면 어떻게 페이드 인 함수를 추가합니까? – Ilja

+0

내 업데이트 된 답변보기 – jdross

1

사용 불투명도를 사용하여이

$(document).ready(function() { 
    // put jquery fade call in here 
}); 

에 코드를 넣어 (필터 : 알파 (불투명도 = 0), 즉에 대한) #로 내용

다음

을 추가 $ ("# 내용"). fadeIn (기간) 함수에

+0

시도했는데 전혀 콘텐츠가 표시되지 않습니다. 콘텐츠 div에 불투명도가 0 인 것으로 보입니다. 내가 콘텐츠에 대한 불투명도를 0으로 설정해야한다고 생각하지 않는다. 아마도 inc/home.php 파일의 다른 div 일 수 있을까? – Ilja

+0

나는 그것을 잘못 읽었고, 당신은 HTML을로드하고있는 div에 넣었다. :) – alinn