为什么不把第一张图片加载到我的ipad上

why dont load the images for the first on my ipad

本文关键字:加载 我的 ipad 一张 为什么不      更新时间:2023-09-26

我有一个画廊滑块在我的项目。

我已经在我的电脑上测试过了,一切正常,

但是当我在iPad上测试时,当我打开我的项目时,画廊滑块的图像不会加载。

滑动条中的图像总数为62张,总大小为1.2mb

我代码:

<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"
 )

我的问题解决了。

我做了什么:

: 我之前有一个HTML文档,其中有几个data-role="pages",第一个data-role="page"是我的菜单,用户可以在其中选择选项。当用户点击其中一个选项时,我的代码是<a href="#p2"></a>,正常转到另一个页面,(注意:只有一个选项必须在另一个页面加载图库中的图像)

: 现在,我把这个文档分成两部分。一个文档html只用于起始页(菜单),其余几个data-role="pages"放在另一个文档中。

我是如何完成调用的:

我使用了一个带有新函数的弹出窗口,在使用了其中一个函数的select之后,我使用了下面的代码:

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

,魔术就完成了。没有额外的代码等....只从另一个子文件夹加载包含画廊滑块的文档HTML。

快速尝试:强制预加载所有图片。如果你的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"
            )

我读了这一页的信息。还有其他方法可以预加载图像。

在iOS Safari上加载的图像限制是在小于256 MB的设备上运行的3 MB,在大于256 MB的设备上运行的5 MB。

http://developer.apple.com/library/safari/文档/AppleApplications/引用/SafariWebContent/CreatingContentforSafarioniPhone CreatingContentforSafarioniPhone.html