.fade不能延遲褪色

Question

試圖將淡入淡出500延遲到1000，但是當我將.fadeTo('500', 1);更改爲.fadeTo('1000', 1);時，不會延遲淡出。同樣的時間，到1000

Jquery的500沒有什麼區別：

$(".more-post").one("click", function() { 

    $('.bottom-post').addClass('show-more').fadeTo('500', 0); 

    setTimeout(function(){ 

    $('.bottom-post').addClass('show-more').fadeTo('500', 1); 

    },4000); 
}); 

這jQuery的褪色速度非常快，因此，如何淡出延遲更.fadeTo('1000', 1);。想淡出更慢。謝謝。

Answer 1

當我刪除了addClass（）和改變$（ 「更郵報 」）一個到$（「。更郵報」）上就開始工作了：

$(".more-post").on("click", function() { 
 

 
    $('.bottom-post').fadeTo(5000, 0); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="more-post">Click me to see the fade<div> 
 
    <div class="bottom-post">Fade me slow<div>

OR

您可以使用jQueryUI的個toggleClass here

$(".more-post").on("click", function() { 
 
    $('.bottom-post').toggleClass('more-post', 3000).toggleClass("hide-post", 5000); 
 
}); 
 
$(".hide-post").on("click", function() { 
 
    $('.bottom-post').toggleClass("hide-post", 3000).toggleClass('more-post', 5000); 
 
});

.more-post { 
 
    opacity: 1; 
 
} 
 

 
.hide-post { 
 
    opacity: 0; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
<div class="more-post">Click me to see slow fading<div> 
 
    <p class="bottom-post hide-post">More stuff to be faded in</p>

Answer 2

您應該嘗試設置fadeTo（'3000'，1）。 這裏3000表示3秒。您可以增加它以獲得更慢的衰落。 。