有点连线,但这就是问题所在。我有 jQuery 动画和许多其他事件,当我的 css 文件中图像宽度和高度以像素为单位时可以正常工作,但是当我将它们设置为百分比或自动时(高度:100%;宽度:自动;-> 我需要什么它是),我的整个网站变慢了。事件不会立即触发,而且我的动画一点也不流畅(我只看到 2 或 3 帧的动画)。任何想法可能是什么问题或如何解决?
我的动画示例(左右是 div):
$("#left").animate({"width":"+=15%"},"linear");
$("#right").animate({"width":"+=15%"},"linear");
CSS:
img {
height: 100%;
width: auto;
}
最佳答案
每当我在使用动画时遇到网站性能问题时,它们几乎总是涉及图像太大。当您使用百分比调整大小时,可能不会立即明显看出您的图像比需要的大得多。
平均桌面屏幕尺寸现在是 1366×768,这意味着对于大多数网站来说,全屏画廊的最大图像宽度/高度应该是 1366/768 (如果这些图像用作图标/缩略图,显然更少)。
在开发人员面板中检查您的图像的原始尺寸,并确保它们不超过这些尺寸:这很可能会解决您的性能问题。
关于javascript - 带有百分比的图像大小会减慢网站速度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24284459/