像flipboard一样自动生成图像动画

时间:2013-12-23 09:38:12

标签: jquery jquery-animate

我试过了jquery flip plugin。我可以在鼠标点击时翻转。

我的代码是

$("#flipRoot").flip({
        effect:"flip",
        forwardDir: "ttob",
        height: "300px",
        showpager: true,
        loop: true});

我试图在特定的时间间隔打电话给同样的人,如:

window.setInterval(function() {
 $("#flipRoot").flip({
        effect:"flip",
        forwardDir: "ttob",
        height: "300px",
        showpager: true,
        loop: true});
}, 7200);

但是自动翻转失败了。知道如何实现这个吗? 这是jquery fiddle

1 个答案:

答案 0 :(得分:2)

你应该在github上检查了演示页面,这是作者使用的代码:

DEMO

// a kind of autostart
 var timer = 2000;
 var autostart = function () {
     var $flipRoot = $("#flipRoot");
     var pageCount = $flipRoot.children(".flipContent").length;
     var flipObject = $.data($flipRoot[0], 'plugin_flip');
     var pageIdx = 0;

     return flip = function () {
         flipObject.flipNext();
         pageIdx++;
         if (pageIdx == pageCount) {
             pageIdx = 0;
         }

         setTimeout(flip, timer);
     }
 }

 setTimeout(autostart(), timer);
相关问题