Question

我的网站http://galnova.com/刚刚获得了响应式升级。它在浏览器上很好但是当我在我的三星设备上看它时，页面不会滚动而且它会像疯了一样摇晃。我在页脚类或结构本身中找不到任何错误，但我很好奇为什么会这样。

<footer>
<div class="wrap">
<a rel="license" href="http://creativecommons.org/licenses/by-nc-nd/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-nc-nd/3.0/88x31.png" /></a><br />This work by <a xmlns:cc="http://creativecommons.org/ns#" href="http://www.galnova.com" property="cc:attributionName" rel="cc:attributionURL">Keith Jeter</a> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-nd/3.0/deed.en_US">Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported License</a>.<!--<br />Based on a work at <a xmlns:dct="http://purl.org/dc/terms/" href="http://www.galnova.com" rel="dct:source">http://www.galnova.com</a>.-->

<p class="pull-right"><a href="#">Back to top</a></p>
<p>&copy; 2015 Galaxy Supernova &middot; <!--<a href="#">Privacy</a> &middot; <a href="#">Terms</a>--></p>
</div>
</footer>

Answer 1

尝试向页脚添加已定义的高度，并使用任何效果向后报告。

像这样：

@media (max-width: 767px)
    footer {
    border-radius: 0!important;
    border: none!important;
    margin: 0!important;
    height: 400px;
}

编辑：无视上述内容;问题来自Pirobox重叠插件。从CSS的角度来看，我注意到的一个快速解决方法是将overflow: hidden添加到Pirobox stylesheet you reference中的.piro_html类，如下所示：

.piro_html {
    position: absolute;
    top: 0;
    left: 0;
    padding: 0;
    width: 500px;
    height: 500px;
    margin: 0;
    display: block;
    padding: 0;
    z-index: 150001;
    padding: 0;
    overflow: hidden;
}

执行此操作会导致您丢失小“X”关闭框，但由于您可以点击暴露的正文副本上的任何位置来逃离灯箱，这似乎是一个可接受且干净的解决方案。你也可以考虑使用jQuery代码。

请告诉我这是否适合您。

网站页脚在我的移动设备上不稳定

1 个答案: