1

我正在使用 jquery 1.7.1 和 jquery-mobile 1.1.0。它适用于 iPhone（和 iPad）设备 - 在 Mac OS X 上使用 xCode 进行了测试。

我有一个多页面模板（不是简单页面）：

<div data-role="page" id="page-start">
    <img src="src/images/header-img.png" style="max-width:100%;" />

    <div data-role="content">
        <p>
            Welcome to the test page<br/>
            now some test input fields:
        </p>
        <div data-role="fieldcontain">
            <label for="name">Text Input:</label>
            <input type="text" name="name" id="name" value=""/>
        </div>
        <div data-role="fieldcontain">
            <label for="name2">Text Input:</label>
            <input type="text" name="name2" id="name2" value=""/>
        </div>
    </div>
</div>

现在我的问题是，页面已经显示，但是图像（原点宽度：770px）的显示延迟了 2-3 秒。如果没有“最大宽度”或简单的“宽度”样式属性，它会直接显示（但宽度为 770 像素）。

如何解决显示页面时图像已经加载的问题？

我还尝试隐藏“#page-start”（最初使用 style="display:none"）并在 javascript 上执行：

$(document).bind('pageinit', function() {
    $("#page-start").show();
});

但这并没有解决我的问题，页面直接显示，图像需要 2,3,4 秒才能显示出来并且页面向下跳了一下（特别是图像高度）。

4

0 回答 0