IOS 7 - css - html height - 100%= 692px [英] IOS 7 - css - html height - 100% = 692px

查看:135
本文介绍了IOS 7 - css - html height - 100%= 692px的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在iPad iOS7风景模式有一个奇怪的错误。

I have a weird bug on iPad iOS7 landscape mode.

我可以调查的是,在iOS7 window.outerHeight是692px和
窗口.innerHeight 672px;而在以前的版本中,这两个值都是672px。

What i was able to investigate is that in iOS7 window.outerHeight is 692px and window.innerHeight 672px; while in previous versions both values are 672px.

即使我的< html> < body> 标签的高度100%似乎有空间滚动,奇怪的是这个问题只出现在landscpae上

Even though my <html> and <body> tags have height 100% there seems to be space for scrolling, and the weird thing is that this problem only shows up on landscpae

你可以通过访问t.cincodias.com看到我在说什么,例如,在iOS 7 iPad中,页脚栏(或者页眉有时)将被剪切。

You can see what i am talking about by visiting t.cincodias.com, for example, in a iOS 7 iPad the footer bar (or the header sometimes) will be cut. But on previous iOS versions the content displays fine at fullscreen.

即使我将两个标签的高度都设置为 height:672px!important position:absolute; bottom:0; ,您仍然可以通过触摸iframe(广告是iframe)垂直滚动内容。

Even when i set the height of both tags to height: 672px !important and position:absolute; bottom: 0;, you can still scroll the content vertically by touching an iframe (the ads are iframes).

发布候选版本的iOS7

I'm running the release candidate version of iOS7

感谢您的帮助。

推荐答案

我使用这个JavaScript解决方案来解决这个问题:

I used this JavaScript solution for solving that problem:

if (
    navigator.userAgent.match(/iPad;.*CPU.*OS 7_\d/i) && 
    window.innerHeight != document.documentElement.clientHeight
) {
    var fixViewportHeight = function() {
        document.documentElement.style.height = window.innerHeight + "px";
        if (document.body.scrollTop !== 0) {
            window.scrollTo(0, 0);
        }
    };

    window.addEventListener("scroll", fixViewportHeight, false);
    window.addEventListener("orientationchange", fixViewportHeight, false);
    fixViewportHeight();

    document.body.style.webkitTransform = "translate3d(0,0,0)";
}

这篇关于IOS 7 - css - html height - 100%= 692px的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆