2012-06-13 3 views
1

크롬이나 사파리에서 작동하는 단순한 페이드 인 효과를 얻지 못했지만 jsfiddle (Chrome 19.0.1084.56 & Safari 5.1)과 완벽하게 작동합니다. 7). 나는 또한 자바 스크립트 오류가 작동하지 않을거야. 이전에 나는jQuery fadeTo 및 fadeIn은 JSFiddle을 제외한 어느 곳에서도 작동하지 않습니다.

$ ("# 페이드")을 시도했다. 또한 jsfiddle에 있지만 내 파일에 괜찮 았는데(). fadeIn

을 숨 깁니다. 재미있게도, fadeOut은 내가 그것을 사용할 때 문제없이 작동합니다.

다음은 내 코드입니다. 괜찮습니까? 왜 그것이 나를위한 것이 아닌지에 대한 생각이 있다면 저에게 알려주십시오!

<html> 

<head> 

<title>Wheee jQuery!</title> 

<!-- jquery --> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 

<script type="text/javascript"> 

$("#fade").fadeTo(2000, 1); 

</script> 

<!-- css --> 
<style type="text/css"> 
#fade{ 
    width: 150px; 
    height: 30px; 
    text-align: center; 
    color: blue; 
    border: 1px dotted blue; 
    opacity: 0.3; 
} 
</style> 

</head> 

<body> 


<div id="fade"> 
lalala 
</div> 

</body> 

</html> 
+2

사용'$ (문서) .ready (함수() {/ * mycode의 * /}); 기본 JSFiddle 코드에 의해 (수신 8 응답)가 윈도우 부하에서 실행되는'가 아닌 머리는 풀어. –

+1

div가 렌더링되기 전에'fadeTo' 메서드를 호출했거나'

lalala
'아래로 호출하거나'$ (document) .ready (function() {}) '메서드를 호출하십시오 – Wiz

답변

3

는 JSFiddle는 body.onload 이벤트 내에서 JavaScript 패널 내에서 발견 된 코드를 실행 선택 OnLoad 있습니다. 반면에 코드는 헤더에서 래핑되지 않은 코드를 실행합니다. JSFiddle의 상황을 시뮬레이트하려면 OnLoad 대신 No Wrap을 선택하면 서버 에서처럼 코드가 갑자기 작동하지 않게됩니다.

이 문제를 해결할 수 없음 랩과 JSFiddle의

$(document).ready(function(){ 
    $("#fade").fadeIn(2000); 
}); 

샘플 코드를 포장 : http://jsfiddle.net/3cXvL/1/

대체 솔루션은 영향을주지 할 필요가 사업부 후 코드를 삽입하는 것입니다.

<div id="fade"></div> 
<script> 
    $("#fade").fadeIn(2000); 
</script> 
+0

당신이 주석을 달았을 때 이미 바이올린을 시작 했으므로 downvote가 여러분의 것이 아니기를 바랍니다.} 검색 목적으로 전체 코드를 게시하는 것이 좋습니다. –

+0

@ChristopherMarshall 아니, 나는 너의 것에 찬성했다. 대답으로 나 자신을 게시하기에는 너무 게으른 것이었다. –

2

"수신 $(document).ready(function(){/*mycode*/}); (수신 8 개의 답변)"- Kevin.

저에게 맞습니다. 기본적으로 http://jsfiddle.net/3cXvL/

$(document).ready(function() { 
    $("#fade").fadeTo(2000, 1); 
}); 
+0

완벽하게 작동합니다. 감사합니다! – spops

+1

Kevins를 선택해야합니다. StackOverflow에 오신 것을 환영합니다! –