爲什麼我的jQuery SlideDown動畫Laggy/Jumpy？

Question

我一直在試圖實現SlideDown動畫來顯示一個div時，另一個div被點擊。

我所遇到現在被分揀很多問題，但主要的問題是，jQuery的動畫非常Laggy和跳動的

有什麼我可以做，以平滑動畫？我閱讀了一個緩動插件 - 他們有幫助嗎？

代碼這裏：http://www.bootply.com/a8pRzgsjtl

的jQuery：

$(document).ready(function() { 
        $(".virus").click(function() { 
        $(".v").siblings().hide(); 
        $(".information").slideDown(2000); 
        $(".v").fadeIn('slow'); 
        $('html, body').animate({scrollTop:200}, 1000) 

       }); 

       $(".screenRepair").click(function() { 
        $(".screenInfo").siblings().hide(); 
        $(".information").slideDown(2000); 
        $(".screenInfo").fadeIn(1000); 
        $('html, body').animate({scrollTop:200}, 1000); 
       }); 

       $(".SoftwareRepair").click(function() { 
        $(".softwareR").siblings().hide(); 
        $(".information").slideDown('slow'); 
        $(".softwareR").fadeIn('slow'); 
        $('html, body').animate({scrollTop:200}, 1000); 
       }); 

       $(".MemoryUpgrades").click(function() { 

        $(".MemoryInfo").siblings().hide(); 
        $(".information").slideDown("slow"); 
        $(".MemoryInfo").fadeIn('slow');   
        $('html, body').animate({scrollTop:200}, 1000); 
       }); 

       $(".hardwareRepair").click(function() { 
        $(".hardwareInfo").siblings().hide(); 
        $(".information").slideDown('slow'); 
        $(".hardwareInfo").fadeIn("slow"); 
        $('html, body').animate({scrollTop:200}, 1000); 
       }); 

       $(".WindowsReinstall").click(function() { 
        $(".WindowsInfo").siblings().hide(); 
        $(".information").slideDown("slow"); 
        $(".WindowsInfo").fadeIn("slow"); 
        $('html, body').animate({scrollTop:200}, 1000); 
       }); 

       $(".DataRecovery").click(function() { 
        $(".dataInfo").siblings().hide(); 
        $('.information').slideDown('slow'); 
        $(".dataInfo").fadeIn("slow"); 
        $('html, body').animate({scrollTop:200}, 1000); 
       }); 

       $(".maintenance").click(function() { 
        $(".maintenanceInfo").siblings().hide(); 
        $('.information').slideDown('slow'); 
        $('html, body').animate({scrollTop:200}, 1000); 
        $(".maintenanceInfo").fadeIn("slow"); 
       }); 

       $("#close").click(function() { 
        $(".information").slideUp('slow'); 
       }); 


      }); 

Answer 1

一個常見的問題是圖像，如果你的元素包含或具有圖像背景確保它們不會太重？