README

OwlCarouselWidget 是 [Owl Carousel 2](https://owlcarousel2.github.io/OwlCarousel2/) 的 Yii2 封装

安装

安装此扩展的首选方式是通过 composer。

运行以下命令之一：

php composer require --prefer-dist panix/wgt-owlcarousel "*"

或者

"panix/wgt-owlcarousel": "*"

将以下内容添加到您的 composer.json 文件的 require 部分中。

插件选项

请参阅 https://owlcarousel2.github.io/OwlCarousel2/docs/api-options.html

用法

安装扩展后，只需在代码中简单使用即可。

<?php
use panix\ext\owlcarousel\OwlCarouselWidget;

OwlCarouselWidget::begin([
    'containerTag' => 'div',
    'containerOptions' => [
        'class' => 'container-class'
    ],
    'options'    => [
        'autoplay'          => true,
        'autoplayTimeout'   => 3000,
        'items'             => 3,
        'loop'              => true,
        'responsiveClass' => true,
        'responsive' => [
            0 => [
                'items' => 1,
                'nav' => false,
                'dots' => true,
                'center' => true,
            ],
            426 => [
                'items' => 2,
                'nav' => false
            ],
            768 => [
                'items' => 2,
                'nav' => false
            ],
            1024 => [
                'items' => 5,
                'nav' => true,
                'dots' => false
            ]
        ]
    ]
]);
?>

<div class="item-class"><img src="/img/1.jpg" alt="Image 1"></div>
<div class="item-class"><img src="/img/2.jpg" alt="Image 2"></div>
<div class="item-class"><img src="/img/3.jpg" alt="Image 3"></div>
<div class="item-class"><img src="/img/4.jpg" alt="Image 4"></div>


<?php OwlCarouselWidget::end(); ?>