Javascript 在屏幕外设置对象动画，无延迟

我一直在使用Animate.CSS和basicjquery在屏幕上和屏幕下为元素设置动画。问题是，由于背景幻灯片与屏幕上的动画同时出现，这会造成很多延迟。我一直在寻找其他方法来帮助解决这个问题

我读过关于使用不透明度和TranslateZ等让元素进出页面的文章

在动画期间，将下面的代码更改为可能更少延迟的最佳方法是什么

 //Screen 7 Start 
//Highest Planned College
$( "#screen7" ).hide()

$(".buttonsQuestion7").click(function() {
$('#screen7').addClass('animated slideOutUp');
$('#screen7').fadeOut()
$( "#screen8" ).show()
$( "#screen8" ).addClass('animated slideInUp');


});

---

我在jQuery动画方面也有滞后问题。问题在于像您这样一个接一个地播放多个动画：

$('#screen7').fadeOut();
$( "#screen8" ).show();

对我来说，解决方法是在第一个动画的回调中调用第二个动画，如下所示：

$('#screen7').effect('fadeOut', {
    direction: 'left', 
    mode: 'hide', 
    duration: '300',
    complete: function(){

        $('#screen8').show();
    }
});

在本例中，我使用的是jQuery UI中的

.effect（）

，但是

.fadeOut（）

具有相同的

complete

回调选项

---

希望这有助于

在屏幕上有许多部分不透明的元素和RGBA颜色，这会像铅气球一样降低性能。不要添加axtra不透明度，使用可见性：隐藏或显示：无，并降低“透明性”谢谢！让我给它打一针让我给它打一针！