Question

我在网页上遇到动画问题。我有这个带有文本的div，我使用css设置边距，当页面加载时，我使用jquery将div设置为页面的某个部分的动画。问题是它适用于我的具体像素设置，但如果我更改屏幕分辨率（像素）中显示器显示设置的属性，div不会动画到适当的位置，它甚至不会在适当的位置启动来自css。

示例代码：

#div{
position:absolute;
top:20px;
left:50px
}

$("#div").animate({marginLeft: "250px"},2000);

无论屏幕分辨率如何，是否有办法让动画边距设置在合适的位置？

Answer 1

我能够找到解决方案，不确定解决方案是最佳实践还是智能解决方案。基本上我所做的是为所有不同的屏幕分辨率设置设置 if condition ，并且每个设置都有自己的参数。例如：

if(screen.width==1600&& screen.height==960)
{
   $("#div").animate({marginLeft: "350px"},2000);
}
if(screen.width==1250&& screen.height==7500)
{
   $("#div").animate({marginLeft: "570px"},2000);
}
etc..

Answer 2

您正在设置margin-left属性的动画，而不是left位置属性。我的猜测是，如果你改用它，你将得到你想要的结果。

此外，您可能希望为#div指定宽度，因为大多数情况下绝对定位元素的宽度效果更好。

监视器显示设置的边距动画问题

2 个答案: