Javascript 背景图像在mobile safari中拉伸

我正在使用背景图像作为登录页，它在桌面浏览器、Android浏览器上运行良好，但在iOS浏览器上运行失败。。。在寻找答案后，我想问题是由于包含的div的高度，它保存了背景图像

我使用jquery'var wheight=$（window.height（）；'

我觉得这样可以得到整个文档的长度，并给人一种图像被拉伸的感觉

我在fiddle上有一个安装示例，这可能会出现在iOS上，因为在使用jQuery添加高度后，我还没有进行测试

处理这个高度问题的最佳方法是什么

我是否应该使用

screen.height（）或者有办法解决这个问题

可以使用vh单元通过css计算窗高。小提琴：

在css部分尝试这个

html, body {
    margin:0;
    padding:0;
}
.bg-intro {
    width:100%;
    height:100vh;
    position:absolute;
}
.bg-intro {
    width:100%;
}
.parallax {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.parallax-1 {
    background-image: url("http://www.hdwallpapersos.com/wp-content/uploads/2014/07/HD-Wallpaper-Nature.jpg");
    transition: height 0.85s cubic-bezier(0.725, 0, 0, 0.995) 0s;
}

对不起，我不知道“高度：100vh；”这是什么；vh是视口高度。我无法为
bg intro
提供绝对位置，我必须使用相对位置，底部还有其他元素，提供绝对位置会破坏设计。但这值得一试。。。
html, body {
    margin:0;
    padding:0;
}
.bg-intro {
    width:100%;
    height:100vh;
    position:absolute;
}
.bg-intro {
    width:100%;
}
.parallax {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.parallax-1 {
    background-image: url("http://www.hdwallpapersos.com/wp-content/uploads/2014/07/HD-Wallpaper-Nature.jpg");
    transition: height 0.85s cubic-bezier(0.725, 0, 0, 0.995) 0s;
}