4

我正在尝试复制 jQuery Mobile 的页面导航系统，您可以在其中调用加载到容器中的 dom 的页面，该容器浮动到右侧，然后进行动画处理，并且到目前为止具有以下内容：http: //s46264.gridserver.com /dev/dave/pageslider/

我的问题是我想在调用 animate 语句之前预加载所有页面内容（请参阅加载第 2 页） 我该怎么做？

到目前为止的代码：

var currPage = "one";

        function loadPage(newPage) {
            $("<div id='" + newPage + "' class='page'></div>").insertAfter('#'+currPage);
            $('#'+newPage).load('pages/' + newPage + '.php', function() {       
                $('#page_wrapper').animate({
                    left: '-400px'
                }, 200, function() {
                    $('#'+currPage).remove();
                    $('#page_wrapper').css('left',0);
                    currPage = newPage;
                });
            });
        }

        $(document).ready(function() {
            $("#page_wrapper").append("<div id='" + currPage + "' class='page'></div>");
            $('#'+currPage).load('pages/' + currPage + '.php');
        })

此外，我很新，所以我的方法中的任何错误提示都受到好评。

谢谢

4

1 回答 1

0

看下面的解决方案：

http://chipsandtv.com/articles/jquery-image-preload

您是否尝试过检查 DOM 中已预加载的所有图像标签，并使用以下内容在内存中创建图像元素：

// images is an array with the image filenames, so you'd 
// have to extract these from the preloaded source.
$(images).each(function() {
    var image = $('<img />').attr('src', this);
});

这当然是假设.load()尚未显示此特定行为。

于 2012-06-03T17:54:11.540 回答