JQuery와

Question

작동하지 fadeIn 누군가는 내가 잘못는지 말해 주시겠습니까 :

스타일 :

.warning{border: 1px solid #F0AAAA; background:#FFBABA; color: #C90000;} 

태그 :

<p class="warning">A successful authorization already exists. 
        Further authorizations are not allowed at this time.</p> 

스크립트

$().ready(function() { 
    alert($(".warning").html());  // WORKS 
    $(".warning").fadeIn(4000);  // DOESN'T WORK 
}); 

Answer 1

요소가 숨겨져 있지 않으면 페이드가 발생하지 않으므로 필요합니다. 이 같은 mething :

$(".warning").hide().fadeIn(4000); 

You can give it a try here을, 또한 $() 당신이 $(document)를 사용해야 1.4 이상에서 더 이상 사용되지 않거나 짧은 버전이 같은 :

이

$(function() { 
    $(".warning").hide().fadeIn(4000); 
}); 

대안은 display: none 처음 요소를 제공하는 것입니다 이지만은 JS가 비활성화 된 사용자의 경우 또는 JavaScript 오류가 발생하여 페이드를 방지하는 경우 이러한 접근 방식을 피하려고 할 수 있습니다.

Answer 2

귀하의 css 코드에 display:none을 추가하십시오.

.warning{border: 1px solid #F0AAAA; background:#FFBABA; color: #C90000;display:none} 

Answer 3

나는 당신이 어떤 사건을 기분 전환을 원한다고 생각하는 경향이 있습니다. 여기 예를 들어 작업을 참조하십시오 따라서 http://jsfiddle.net/hPHPn/

:

$(document).ready(function(){ 
    $(".warning").hide();// hide it initially 
    $('#unhideit').click(function(){ 
     $(".warning").fadeIn(4000);       }); 
}); 

을 몇 가지 간단한 마크 업 :

<p class="warning">A successful authorization already exists 
    for this Quote ID. Further authorizations are not allowed at this time.</p> 
<input type="button" id="unhideit" value="clickme" /> 

Answer 4

나는 최근에 내 응용 프로그램에서 같은 일을했다. 내 html 문서의 상단에 내가 가진 : src="advtemp3jquery.js를 말한다

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<script type="text/javascript" src="advtemp3jquery.js"></script> 

부분은 내 외부 .js 파일을 참조. 코드를 외부 파일에 보관하는 것이 깔끔하다는 것을 알았습니다.

$(document).ready(function() { 
    $('.header1,.header2').fadeIn('4000'); 
});