jquery fadeIn không làm việc

Question

Ai đó có thể xin vui lòng cho tôi biết những gì tôi đang làm sai:

phong cách:

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

đánh dấu:

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

kịch bản:

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

Answer 1

Trừ khi phần tử bị ẩn, không có mờ nhạt nào xảy ra, bạn cần mething như thế này:

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

You can give it a try here, cũng $() bị phản đối trong 1.4+, bạn nên sử dụng $(document) hoặc phiên bản ngắn hơn, như thế này:

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

Cách khác là để cung cấp cho các phần tử một display: none ban đầu nhưng ngắt này cho người dùng bị vô hiệu hóa JS hoặc nếu lỗi JavaScript xảy ra ngăn chặn mờ dần, vì vậy bạn có thể muốn tránh xa cách tiếp cận này.

Answer 2

thêm display:none vào mã css của bạn.

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

Answer 3

Tôi có xu hướng nghĩ bạn muốn một số sự kiện được quản lý cho fadin. xem ví dụ làm việc ở đây: http://jsfiddle.net/hPHPn/

Như vậy:

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

đối với một số đánh dấu đơn giản:

<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

Gần đây tôi đã làm điều tương tự trong ứng dụng của tôi. Ở phía trên cùng của tài liệu html của tôi, tôi có:

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

Phần mà nói src="advtemp3jquery.js đề cập đến bên ngoài .js tập tin của tôi. Tôi tìm thấy nó neater để giữ mã trong một tập tin bên ngoài.

Kịch bản nào sau đây:

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