Mobile 位置：绝对导致旋转木马出现故障

我使用的旋转木马插件都不能正常工作。通常我需要调整浏览器的大小，然后才能正确显示所有内容。这是不实际的，因为我的是一个移动应用程序

我已经把这个问题解决了。页面之间的转换要求定位为绝对位置（请参见

#page>div

）。但是，转盘需要相对定位

我尝试在旋转木马周围添加一个额外的

，并将其定位为相对的，但它没有起到作用。任何人都知道如何解决这个问题

Transition.css：

#page {
  position: relative;
}

#page > div {
  display:none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

#page > div.current {
    display: block;
}

HTML:

我找到了问题的答案。实际上是应用于页面的

display:none

和

display:block

显示块导致旋转木马的图像显示块样式，而不是并排显示

---

我使用的不是

显示：无

，而是

可见性：隐藏

，

高度：0

，

溢出：隐藏

。然后，当页面显示时，我只是将其反转

我也解决了这个问题

加载文档后，我使用一些jQuery应用css

例如：

jQuery(document).ready(function($){
$('.more-wrapper').css({"display": "block", "position": "absolute", "left": "50%", "z-index": "100", "bottom": "40px", "-webkit-transform": "translate(-50%,0)", "-ms-transform": "translate(-50%,0)", "-o-transform": "translate(-50%,0)", "transform": "translate(-50%,0)"});
});

jQuery(document).ready(function($){
$('.more-wrapper').css({"display": "block", "position": "absolute", "left": "50%", "z-index": "100", "bottom": "40px", "-webkit-transform": "translate(-50%,0)", "-ms-transform": "translate(-50%,0)", "-o-transform": "translate(-50%,0)", "transform": "translate(-50%,0)"});
});