5

プロジェクトにギャラリー スライダーがあります。

私は自分のコンピューターでテストしましたが、すべて正常に動作します。

しかし、iPad でテストしたところ、プロジェクトを開いたときにギャラリー スライダーの画像が読み込まれませんでした。

スライダー内の合計画像数は 62 で、合計 1.2 MB です

私のコード:

<div class="main">
    <div class="fixed-bar" style="margin-top:40px">
        <ul id="carousel" class="elastislide-list">
            <li><a href="#p1"><img src="imagens/paginas/1.jpg" /></a>
            </li>
            <li><a href="#p2"><img src="imagens/paginas/2.jpg" /></a>
            </li>
            <li><a href="#p3"><img src="imagens/paginas/3.jpg" /></a>
            </li>
            <li><a href="#p4"><img src="imagens/paginas/4.jpg" /></a>
            </li>
        </ul>
    </div>
</div>

Javascript:

$(document).on('pagebeforeshow', function () {
    $('.fixed-bar').hide();
});

$('#carousel').elastislide({
    minItems: 9
});

プリローダー:

var images = new Array()
            function preload() {
                for (i = 0; i < preload.arguments.length; i++) {
                    images[i] = new Image()
                    images[i].src = preload.arguments[i]
                }
            }
            preload(
                "imagens/Paginas/1.jpg",
                "imagens/Paginas/2.jpg",
                "imagens/Paginas/3.jpg",
                "imagens/Paginas/4.jpg",
                "imagens/Paginas/5.jpg",
                "imagens/Paginas/6.jpg",
                "imagens/Paginas/7.jpg",
                "imagens/Paginas/8.jpg",
                "imagens/Paginas/9.jpg",
                "imagens/Paginas/10.jpg",
                "imagens/Paginas/11.jpg",
                "imagens/Paginas/12.jpg",
                "imagens/Paginas/13.jpg",
                "imagens/Paginas/14.jpg",
                "imagens/Paginas/15.jpg"
 )
4

3 に答える 3

5

問題を解決しました。

私がやった事：

前: 複数の data-role="pages" を含む 1 つの html ドキュメントがあり、最初の data-role="page" は、ユーザーがオプションを選択できるメニューです。ユーザーがこのオプションの 1 つをクリックすると、私のコードは<a href="#p2"></a>別のページに移動するのが通常でした (注: このオプションの 1 つだけが別のページのギャラリーに画像をロードする必要があります)。

後: そして今、このドキュメントを 2 つに分割しました。開始ページ (メニュー) のみの 1 つのドキュメント html と、別のドキュメントのいくつかの data-role="pages" の残りの部分。

私はどのように電話をかけましたか：

私は新しい機能でポップアップを使用し、これのいずれかを使用して選択した後、次のコードを使用しました:

<a href="../thisdocument.html" target="_parent"></a>

そして魔法が完成しました。余分なコードなどは必要ありません.... 別のサブフォルダーからギャラリー スライダーを含むドキュメント html のみを読み込みます。

于 2013-06-03T09:17:46.750 に答える
1

クイック トライ: すべての画像のプリロードを強制します。iPad が 4 回目または 5 回目の試行で画像をレンダリングする場合、それは読み込みに時間がかかるためのようです...

次のようなものでプリロードできます。

var images = new Array()
            function preload() {
                for (i = 0; i < preload.arguments.length; i++) {
                    images[i] = new Image()
                    images[i].src = preload.arguments[i]
                }
            }
            preload(
                "http://domain.tld/gallery/image-001.jpg",
                "http://domain.tld/gallery/image-002.jpg",
                "http://domain.tld/gallery/image-003.jpg"
            )

このページの情報を読みました。画像をプリロードする方法は他にもあります。
私はこの助けを望みます...

于 2013-05-30T11:37:35.533 に答える
0

iOS Safari に読み込まれる画像の制限は、256 MB 未満の RAM で実行されているデバイスの場合は 3 MB、256 MB を超える RAM を搭載したデバイスで実行されている場合は 5 MB です。

http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/CreatingContentforSafarioniPhone/CreatingContentforSafarioniPhone.html

于 2013-06-06T08:42:33.587 に答える