jquery - 移动 Safari 上高度为 100% 的 Div

Question

我正在尝试制作一个页面，其中堆叠有“幻灯片”并且用户必须滚动。每张幻灯片都应该填满整个视口(viewport)。所以我有这个 CSS:

html,
body,
.slide {
  height: 100%;
}

在我的 HTML 中我只是有

<div class="slide">
  <!-- Content Slide #1 here -->
</div>
<div class="slide">
  <!-- Content Slide #2 here -->
</div>

而且效果很好。问题是在我的 iPhone 上，第二张幻灯片不够高。
它的大小似乎是用顶部的滚动条计算的，但是当我向下滚动时，没有滚动条。我想我需要 jQuery 来解决这个问题，但我该怎么做呢？

Answer 1

如果你想使用 jQuery 你可以这样做

if( /iPhone|iPad|iPod/i.test(navigator.userAgent) ) {
   $('.slide').css({'height':'100%'});
}