1

jQuery、jQuery.mobile、asyraf9 splitview プラグイン、および cubiq の iScroll を使用して、iOS アプリケーション内に追加される分割ビュー ページを作成しています。典型的な分割ビューとして、左側にサイドバー、右側にコンテンツ エリアがあります。

これは画像です: http://i.stack.imgur.com/kfUyE.png

シンプルなjs-lineでタッチムーブを防ぎます

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

コンテンツ領域を iScroll でスクロールできるようにします。

ただし、いずれかのページに別のドメインからの iFrame が埋め込まれている必要があります。この種のページには iScroll を使用しません。iFrame 内にリンクがあるので、それらをクリックできるようにする必要があります。

<div class="iframe-wrapper">
<iframe id="iframe-element" frameborder="0"></iframe>
</div>

それはCSSのようなものを持っています

.iframe-wrapper {
    margin: 0 auto;
    height: 100%;
    width: 670px;
    -webkit-overflow-scrolling: touch;
    overflow: scroll;
}

#iframe-element {
    height: 100%;
    width: 670px;
}

必要なページが呼び出されたときに、javascript を介して iFrame の src をロードします

$('#page-1-3')
    .one('pageshow', function() {
        $('#iframe-element').attr('src', 'http://www.somewebsite.com');
    });

ただし、iOS6 の Safari ではうまく機能しますが、iOS5 では機能しません。iFrame 内のコンテンツをスクロールすることもありますが、同時にページ全体を上下に移動します。ページの残りの部分でそのような動作を防止したとしてもです。下にスクロールすると、ページの末尾より下にコンテンツが表示されません (複数のページに表示されます)。

私は多くの方法で解決策を試したり、Web を検索したりしましたが、どれもうまくいかないようです。コンテンツをうまくスクロールしないか、すべてをレンダリングしないか、コンテンツをまったくスクロールしないかのいずれかです。

誰かがそれについて何か役立つことを私に勧めてくれませんか?

4

0 に答える 0