2013-04-26 2 views
1

jQuery를 사용하여 내 홈페이지를 페이드 인했지만 현재 흰색에서 페이드 인합니다. 검은 페이지에서 페이드 인 할 수있는 방법이 있습니까? 이것은 iframe을로드 할 때와 같은 종류이며 흰색으로 깜박입니다. 나는 그것이 고칠 수 있다는 것을 압니다. 그래서 나는 이것에 대한 수정이있을 것이라고 생각합니다.jQuery fadeIn with Background Image

CSS :

html { 
    background: black url(images/bg.jpg) no-repeat 200px center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    height: 100%; 
    display: none; 
} 
body { 
    margin: 0; 
    height: 100%; 
    padding-left: 40px; 
    padding-top: 25px; 
} 

스크립트 :

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title></title> 
<link href="home.css" rel="stylesheet" type="text/css"> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('html').fadeIn(3000); 
    }) 
</script> 
</head> 
<body> 
</body> 
</html> 

답변

3

예, <body>

<body><div id="page">Content here</div></body> 

CSS

로 변경 시도
html,body{background:#000; height: 100%} 
#page{ 
    background: black url(images/bg.jpg) no-repeat 200px center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    height: 100%; 
    display: none; 
} 

자바 스크립트

$(document).ready(function(){ 
    $('#page').fadeIn(3000); 
}) 

에 테스트 havn't는하지만, 당신을 위해 일할 수있는 :) 그냥 흰색 플래시 완전 똑같은 일을 수행

+0

합니다. – pianoman

+0

다시 시도해 보겠습니다. 일부 CSS를 업데이트했습니다. – Ejaz