0

我建立了一个 jquery 移动网上商店，几乎一切都很完美。

这是我的脚本部分：

$('div[data-role="page"]').live("pageinit",function(event){

$("#foo").carouFredSel({
    responsive  : true,
    scroll      : {
        fx          : "cover-fade"
    },
    items       : {
        visible     : 1,
        width       : 350,
        height      : "100%"
    },
    swipe: {
        onMouse: true,
        onTouch: true
    }
  });
});

我想使用carouFredSel 插件，因为它反应灵敏并支持滑动手势。

问题是，当您访问页面（http://m.wohnfreuden.de）时，轮播没有加载，有时在刷新站点后显示，有时所有幻灯片都相互显示。

希望您能帮助我找到正确的解决方案。

4

1 回答 1

0

首先，我的建议是找到另一个旋转木马。我是根据我的经验说的。

一年前我发现carouFredSel了插件，乍一看它是一个完美的轮播，有大量可能的变化（当时没有滑动功能，但很容易修复）。

不幸的是，在应用程序测试阶段，发现插件在与jQuery Mobile结合时由于某种原因随机刹车（在没有 jQuery Mobile 的桌面 Web 应用程序上没有发现同样的问题）。插件随机跳过初始化，图片一张张显示。我个人认为内容高度对这个插件很重要，而且 jQuery Mobile 页面高度甚至只能在 pageshow 期间才能正确计算，但即便如此也可能存在一些问题。

这是我们用来使用 jQuery Mobile 初始化插件的演示（概念证明）：http: //jsfiddle.net/Gajotres/Np3G4/

它只能从右向左滑动。

$('#carousel').carouFredSel({
    width: '100%',
    height: 250,
    items: 5,
    auto: false,        
    scroll: {
        items: 1,
        duration: aniConf.duration,
        onBefore: function( data ) {          
            data.items.old.eq(1).animate(cssSmall, aniConf);
            data.items.old.eq(2).animate(cssMedium, aniConf);
            data.items.old.eq(3).animate(cssLarge, aniConf);
            data.items.old.eq(4).animate(cssMedium, aniConf);
        }
    }
});

$("#carousel, #home").bind('swipeleft',function(event, ui){
     $("#carousel").trigger("next", 1);
});

最后，我的建议是找到另一个解决方案，因为如果开发人员在过去一年中没有解决这个问题，我认为他们永远不会。

于 2013-07-19T08:19:42.887 回答