为什么我的jQuery SlideDown动画滞后/跳跃

Why is my jQuery SlideDown animations Laggy/Jumpy?

本文关键字:滞后 跳跃 动画 SlideDown 我的 jQuery 为什么      更新时间:2023-09-26

我一直在尝试实现 SlideDown 动画,以便在单击另一个div 时显示一个div。

我遇到了许多现在已经排序的问题,但主要问题是jQuery动画非常滞后和跳跃

我能做些什么来平滑动画吗?我读到了一个缓和插件 - 它们有帮助吗?

此处代码:http://www.bootply.com/a8pRzgsjtl

j查询:

$(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');
                });

            });

一个常见的问题是图像,如果您的元素包含或具有图像背景,请确保它们不会太重......