Javascript 无论我尝试什么，我的幻灯片都不会集中显示

我有一个自动播放的幻灯片（由jQuery/JS控制），它要求每个图像都绝对定位。问题是，我试图在我的页面上水平居中放置这张幻灯片，但我尝试的一切似乎都不起作用。幻灯片不仅必须以全屏宽度居中，而且在调整浏览器大小时也必须居中

根据我的理解，任何被定位的东西都应该相对于下一个被定位的祖先进行定位。在我的代码中，这个祖先恰好是“.fadein”div（我认为？还是应该是“#slideshow”div？），它的位置相对较低。因此，如果我放置这个“.fadein”div，理论上，幻灯片也应该在页面上移动

这确实有效。我可以从左侧（或任意一侧）相对定位“.fadein”div 100px（或其他），幻灯片也会移动

但我找不到任何可靠的方法将幻灯片放在我页面的水平中心，而没有：

1） 导致图像一侧出现额外的“空白”，从而导致页面底部出现一个滚动条，而不会导致任何结果

2） 防止在调整浏览器大小时调整图像大小

编辑1:我能够使幻灯片集中显示，但还找不到调整大小的方法

希望有人能帮我解决这个问题。谢谢

$（函数（）{
$（'.fadein img:gt（0）'）.hide（）；
setInterval（函数（）{
$（“.fadein:第一个孩子”）.fadeOut（2000年）
.next（'img'）.fadeIn（2000）
.end（）.appendTo（'.fadein'）；
}, 5000);
});
.fadein{
位置：相对位置；
}
法登先生{
位置：绝对位置；
左：0；
}
您实际上可以使用css中的calc，例如：

.your-absolute-element {
  position: absolute;
  left: calc(50% - sizeOfElement);
}

这是一个选项，有许多方法可以使定心框的中心对齐。

$（函数（）{
$（'.fadein img:gt（0）'）.hide（）；
setInterval（函数（）{
$（“.fadein:第一个孩子”）.fadeOut（2000年）
.next（'img'）.fadeIn（2000）
.end（）.appendTo（'.fadein'）；
}, 5000);
});
body，html{
位置：相对位置；
身高：100%；
}
法丹先生{
位置：相对位置；
身高：100%；
}
法登先生{
位置：绝对位置；
左：50%；
最高：50%；
-webkit转换：翻译（-50%，-50%）；
}
#幻灯片放映{
位置：绝对位置；
宽度：100%；
身高：100%；
}

我建议使用placehold.it作为用于堆栈溢出的占位符图像，您基本上可以拥有允许所有人查看的URL，例如将图像源设置为右侧，感谢@Charles380的提示。我尝试了这个方法，它可以完美地将图像居中，但不会调整图像大小。我认为这应该是一个简单的解决办法，但我仍在努力让我的头围绕它。。。