android - Phonegap (Cordova) Swipe 框架和图像

Question

我正在测试一个非常简单的页面，该页面可以刷出 phonegap 应用程序中的内容。我从 jquery mobile swipeleft 和 swiperight 开始，但没有用。所以我再次切换到 dojo SwapView，但没有成功。我删除了所有内容，当我只有文本时，它工作得很好(对于 jquery 和 dojo)。一旦我添加了任何图像，两个框架都无法识别滑动并且不会切换内容。所以我假设这是 phonegap/cordova 和图像的缺点。

我认为这可能与我的 CSS 和包含图像的 div 的定位有关。所以我删除了所有的 css 并且再次，滑动没有被识别并且没有内容被交换。

我在网上搜索了一下，没有看到其他人提示这个问题。添加图像时还有其他人遇到这个问题吗？

jquery 示例:

<div data-role="page" id="page1">
    <div data-role="content"> 
    <p class="story">page1 content</p>
    <div id="imagediv">
        <img src="img/myimage.png" width="70%"/>
    </div>
    </div>
    </div>
    <div data-role="page" id="page2">
        <div data-role="content">
            <p class="story">content here
            </p>
        </div>
    </div>

jquery 滑动逻辑:

$(document).delegate('.ui-page', "swipeleft", function(){
    var $nextPage = $(this).next('[data-role="page"]');
    if ($nextPage.length > 0) {
        $.mobile.changePage($nextPage, { transition: "slide" });
    }
}).delegate('.ui-page', "swiperight", function(){
    var $prevPage = $(this).prev('[data-role="page"]');
    if ($prevPage .length > 0) {
        $.mobile.changePage($prevPage, { transition: "slide", reverse : true });
    }
});

同样，在我添加图像之前工作正常。在浏览器(Chrome 和 Firefox)中也能很好地工作。顺便说一句，我正在 android 上进行测试。

Answer 1

我想我找到了问题所在...图像文件太大，因此重绘每个页面的时间太长。通过减小图像尺寸，一切都按预期进行。这很烦人，因为我想制作一个带有动画的交互式应用程序，但是动画 gif 文件太大，jquery 无法运行。我想知道这是否是 phonegap 应用程序的已知限制。