Javascript 即使内容比屏幕宽，也将div居中

这类似于其他问题，但有一个额外的问题，我找不到任何人与我有相同的问题

我有一个1400像素宽的图片，我想要集中在页面中间，即使用户正在浏览一个具有800 px分辨率的浏览器。

我不能使用背景图像，因为我需要使用jquery cycle插件将此图像与其他一些图像一起旋转

我发现使用以下方法将图像居中：

div.slideshowWrap {
  position: relative;
  width: 100%;
  overflow: hidden;
}
  div.slideshowWrap div.homeslideshow {
  position: relative;
  width: 10000px;
  left: 50%;
  margin: 0 0 0 -5000px;
  text-align: center;
}

<div class="slideshowWrap">
    <div class="homeslideshow">
        <?php echo $this->Html->image('background_01.jpg');?>
    </div>
</div>

div.slideshowWrap{
位置：相对位置；
宽度：100%；
溢出：隐藏；
}
div.slideshowWrap div.homeslideshow{
位置：相对位置；
宽度：10000px；
左：50%；
利润率：0-5000px；
文本对齐：居中；
}

工作正常，但当我添加jquery循环所需的额外幻灯片时，它会弄乱定位

<div class="slideshowWrap">
    <div class="homeslideshow">
        <?php echo $this->Html->image('background_01.jpg');?>
    </div>
    <div class="homeslideshow">
        <?php echo $this->Html->image('background_02.jpg');?>
    </div>
    <div class="homeslideshow">
        <?php echo $this->Html->image('background_03.jpg');?>
    </div>
</div>

我不确定解决这个问题的最好办法是什么？似乎没有办法集中图像，只有背景。但是没有办法像jquery cycle插件允许的那样淡入淡出背景

有人有什么想法吗？

试试这个：

.homeslidshow { 
    position: relative; /* if there is no position applied already */
}

.homeslideshow > img{
    position: absolute;
    left: 0px;
    right: 0px;
    /* and your width here */
}

---

我在最近的一篇文章中看到了这种技术

类

.homeslideshow

是否已位于中心？在第一个示例中，当只有一个背景图像时，则.homeslideshow位于中心。如果我像第二个例子中那样添加更多的图像，那么一切都会出错。这对我不起作用。我的问题也是关于使用jquery循环插件的：(