jQM / jquery-collagePlus 使用问题

我正在使用 jQM 构建应用程序，并且尝试使用 jquery-collagePlus （http://ed-lea.github.io/jquery-collagePlus/ http://ed-lea.github.io/jquery-collagePlus/)

这是jsfiddle：http://jsfiddle.net/z5HfK/ http://jsfiddle.net/z5HfK/

My HTML:

<div class="collage">
    <img src="http://mywaiter.my/images/food1.jpg">
                    <img src="http://mywaiter.my/images/food2.jpg">
                    <img src="http://mywaiter.my/images/food3.jpg">
                    <img src="http://mywaiter.my/images/food4.jpg">
                    <img src="http://mywaiter.my/images/food5.jpg">
                    <img src="http://mywaiter.my/images/food6.jpg">
                    <img src="http://mywaiter.my/images/food7.jpg">
                    <img src="http://mywaiter.my/images/food8.jpg">
                    <img src="http://mywaiter.my/images/food9.jpg">
                </div>

The JS:

$(window).load(function () {
        $('.collage').collagePlus();
    });

它似乎不起作用，因为我是 JS 新手，我不太清楚为什么。

在我的应用程序测试中，加载 jQM 页面后所有图像都消失了。

请对我做错了什么提出建议。谢谢。

使用 jQuery Mobile 时，您需要使用适当的 jQuery Mobile 页面事件，在本例中为 showpage（jQuery Mobile 1.4 及更低版本）或 pagecontainershow（jQuery Mobile 1.4 及更高版本）。

工作示例：http://jsfiddle.net/Gajotres/26WXB/4/ http://jsfiddle.net/Gajotres/26WXB/4/

jQuery Mobile 1.4 及更高版本

$(document).on('pagecontainershow', function (e, ui) {
    var activePage = $(':mobile-pagecontainer').pagecontainer('getActivePage').attr('id');
    if(activePage === 'index') {
        $('.collage').collagePlus(
            {
                // change this to adjust the height of the rows
                'targetHeight' : 100,
                // change this to try different effects
                // valid effets = effect-1 to effect-6
                'effect' : "effect-1"
            }
        );   
    }
});

或 jQuery Mobile 1.4 及以下版本：

$(document).on('pageshow', '#index', function(){ 
    $('.collage').collagePlus(
        {
            // change this to adjust the height of the rows
            'targetHeight' : 100,
            // change this to try different effects
            // valid effets = effect-1 to effect-6
            'effect' : "effect-1"
        }
    );             
});