Fancybox 3.1幻灯片之间的过渡效果

时间:2017-06-07 09:05:49

标签: fancybox-3

根据此https://codepen.io/fancyapps/pen/LyNXqr 幻灯片之间的过渡效果,可以“旋转”“淡出”圆形“等等。我已经在使用FB 3.1

目前在下面的代码中,我已将过渡效果设置为旋转,但它不起作用。请告诉完整而准确的代码以及它应放在何处。因为我对JS很新,因为我对HTML和CSS知之甚少。

  $.fancybox.defaults.loop = true;

                        $('[data-fancybox="project1"]').fancybox({
                        slideShow : {
                        autoStart : true,
                        preload: '40',
                        transitionEffect : "rotate",


                                     },

                            });

                    $('[data-fancybox="project2"]').fancybox({
                        slideShow : {
                        autoStart : true,
                        transitionEffect : "rotate",
                                     },

                            });

                    $('[data-fancybox="project3"]').fancybox({
                        slideShow : {
                        autoStart : true
                                     },

                            });

                    $('[data-fancybox="project4"]').fancybox({
                        slideShow : {
                        autoStart : true
                                     },

                            });

                    $('[data-fancybox="project5"]').fancybox({
                        slideShow : {
                        autoStart : true
                                     },

                            });

                    $('[data-fancybox="project6"]').fancybox({
                        slideShow : {
                        autoStart : true
                                     },

                            });

                    $('[data-fancybox="project7"]').fancybox({
                        slideShow : {
                        autoStart : true
                                     },

                            });

                    $('[data-fancybox="project8"]').fancybox({
                        slideShow : {
                        autoStart : true
                                     },

                            });

                    $('[data-fancybox="project9"]').fancybox({
                        slideShow : {
                        autoStart : true
                                     },

                            });

1 个答案:

答案 0 :(得分:0)

发现差异 -

$('[data-fancybox="project2"]').fancybox({
        slideShow : {
            autoStart : true,
            transitionEffect : "rotate"
        }
    });

$('[data-fancybox="project2"]').fancybox({
    slideShow : {
        autoStart : true
    },
    transitionEffect : "rotate"
});