javascript - jQuery FadeIn/FadeOut太突然了

我有这个js代码，

编辑：忘了提一下，在iframe加载时我有这个fadeIn

$('iframe').on('load', function(){
muteVideo();
playVideo();
$(this).fadeIn();
$('.ligarsom').fadeIn();
setTimeout(function() {$('.ligarsom').fadeOut()}, 20000);
});

还有这个

<script>
$(document).ready(function(){
$('.ligarsom').on('click', function(){
$('.ligarsom').fadeOut(1000);
});
});
</script>

和这个html

<div class="ligarsom" style="display:none;"></div>

当我使用style =“ visibility：hidden”时，div甚至不会出现。就像上面的fadeOut不能正常工作一样，它没有动画，只是隐藏了。我的代码有什么问题吗？

可以在以下位置查看实际效果：www.finecolor.com.br/novo

最佳答案

问题：transition:与fadOut()功能动画冲突。

解决方案：将此添加到您的CSS：

.ligarsom, .ligarsom:hover{
    transition: none;
}