Javascript Mozilla firefox使laggy成为我的jquery向下滑动动画

我现在遇到了这个问题。我有一个div，其中包含li img（其中5个），当我尝试用3/10的向下滑动动画重新显示它时，它在mozilla上平滑，在chrome上超过11/11。代码和计算机是一样的，确切的问题是，向下滑动是平滑的，但图像不会随着div的出现而减慢，有时完全不可见，然后突然出现。这不是一个简单的编码问题，因为我甚至尝试在append和animation之间设置timeout（300），但是append是同步的。mozilla中唯一的插件是ad block，就像我的chrome一样。（我知道mozilla考虑使用更重的浏览器，而chrome考虑使用更快的浏览器，但会消耗更多的内存）。代码是这样的（我真的不认为它的代码有问题）

$（文档）.ready（函数（）{
//班级
var$wrapper=$（“.wrapper”）；
var$header=$wrapper.find（“.header”）；
var$center=$wrapper.find（“.center”）；
var$quick=$center.find（“.quick”）；
//钮扣李
var$header_li=$header.find（“ul li”）；
//其他要素
var$quick=$wrapper.find（“.quick”）；
var$rope=$wrapper.find（“#rope”）
var$popup；
函数getquick（）{
$.get（'./php/get_quick.php'，函数（数据）
{
$quick.append（“
”+数据+“
”）；
//设置超时（动画，100）；
动画（）；
toImgsAddPointer（）；
$rope.unbind（'click'）；
$rope.removeClass（'pointer'）；
});
}
函数submitAnswer（）{
var id=$（this.attr（“id”）；
$.get（'./php/result.php'，{'choice'：id}，函数（数据）{
var$ul=$center.find（“ul”）；
$ul.remove（）；
$quick.append（“
”+数据+“
”）；
toImgsAddPointer（）；
});
}
函数clickEvent（）{
紫色变量=“#5061FF”；
var-white=‘white’；
var red=‘red’；
var black=‘black’；
$（this.css（'background-color'，purple.）.css（'color'，white）；
$（this.this（）.css（'background-color'，red.）.css（'color'，black）；
if（this.id==1）{
var div="试着在一个简单的测试用例中用一个HTML元素和jQuery代码来重现这一点。是的，即使只有两个li，mozilla也会损失很多fps。我的意思是，在chrome中，我甚至可以看到元素首先出现在开始位置，然后动画开始，而在mozilla中，它已经显示了动画。我的意思是，制作一个测试用例，例如站在JSFIDLE上，这样我们就可以自己看到它了。
$(document).ready(function(){
//classes
var $wrapper= $(".wrapper");
var $header=$wrapper.find(".header");
var $center = $wrapper.find(".center");
var $quiz=$center.find(".quiz");
// buttons-li
var $header_li= $header.find("ul li");
//other elements
var $quiz=$wrapper.find(".quiz");
var $rope = $wrapper.find("#rope")
var $popup;
function getQuiz(){
    $.get('./php/get_quiz.php',function(data)
    {
        $quiz.append("<ul>"+data+"</ul>");
        //setTimeout(ropeAnimation,100);
        ropeAnimation();
        toImgsAddPointer();
        $rope.unbind('click');
        $rope.removeClass('pointer');
    });
}
function submitAnswer(){
    var id = $(this).attr("id");
    $.get('./php/result.php',{'choice':id},function(data){
        var $ul= $center.find("ul");
        $ul.remove();
        $quiz.append("<ul>"+data+"</ul>");
        toImgsAddPointer();
    });
}
function clickEvent(){
    var purple= '#5061FF';
    var white = 'white';
    var red= 'red';
    var black = 'black';
    $(this).css('background-color',purple).css('color',white);
    $(this).siblings().css('background-color',red).css('color',black);
    if(this.id==1){
        var div = "<div class='popup'><object data='./pdf/math1.pdf'></object></div";
    }else{
        var div = "<div class='popup'><object data='./pdf/math2.pdf'></object></div";
    }
    $wrapper.prepend(div);
    $popup=$(".popup");
    $popup.on('click',closePopup);
}
function closePopup(){
    $popup.remove();
}
function ropeAnimation(){
    $rope.animate({"height":'200px'},100);
    $quiz.slideDown(500);
    $rope.animate({"height":'50px'},700);
}
function toImgsAddPointer(){
    var $img = $quiz.find("li img");
    $img.addClass("pointer");
    $img.on('click',submitAnswer);
}
$header_li.on('click',clickEvent);
$header_li.addClass("pointer");
$rope.addClass("pointer");
$rope.on('click',getQuiz);
});