ios iframe只有在方向从纵向更改为横向后才能展开

Question

我在ios上设置了可滚动的iframe

<div style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: scroll; -webkit-overflow-scroll: touch; ...">
  <iframe style="height: 600px, ...">
  </iframe>
</div>

iframe的高度实际上设置为screen.availHeight ，并且方向改变时不会改变。

现在，如果在手机处于纵向模式时打开了模式，则可以正常工作。 而且，如果手机处于横向模式时打开了模式，则可以正常工作。 如果将其以横向模式打开并旋转为纵向，那也可以正常工作。

但是，如果以纵向模式打开并旋转为横向模式，则无法进行滚动； 您最终会滚动底层页面，而不是模式本身。

尽管事实上无论方向如何，样式都完全相同。

以前有人发生过这种事吗？ 解决方法？ 这是怎么回事？ 我在这里n00b，任何建议表示赞赏。

Answer 1

var doOnOrientationChange = function() {
    switch (window.orientation) {
        case -90:
        case 90:
            console.log('landscape');
            if ($('.modal').length && $('.modal').hasClass('in')) {
                $('.modal').scrollTop(1);
            }
            break;
        default:
            console.log('portrait');
            if ($('.modal').length && $('.modal').hasClass('in')) {
                $('.modal.in').css('overflow', 'hidden');
                setTimeout(function() {
                    $('.modal.in').css('overflow-x', 'hidden').css('overflow-y', 'auto');
                }, 10);
            }
            break;
    }
};

window.addEventListener('orientationchange', doOnOrientationChange);

doOnOrientationChange();

我以这种方式解决了这个问题