README

从 Coderius 分支而来。分支原因：消除脚本并修复一些小错误。Lightbox2 小部件是基于 Lightbox 定制的脚本，并且这个小部件用于在当前页面上覆盖图片。

安装

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

运行以下命令之一：

php composer.phar require bajhoe/yii2-widget-lightbox2 "*"

或

"bajhoe/yii2-widget-lightbox2" : "*"

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

用法

在视图中

use coderius\lightbox2\Lightbox2;

<?= coderius\lightbox2\Lightbox2::widget([
    'clientOptions' => [
        'resizeDuration' => 200,
        'wrapAround' => true,
        
    ]
]); ?>

<a href="<?= Yii::getAlias("@img-web-blog-posts/1/middle/pic.jpg"); ?>" data-lightbox="roadtrip" data-title="some title" data-alt="some alt">
    <!-- Thumbnail picture -->
    <?= Html::img("@img-web-blog-posts/pic.jpg"); ?>
</a>

<a href="<?= Yii::getAlias("@img-web-blog-posts/10/middle/pic2.jpg"); ?>" data-lightbox="roadtrip">
    <!-- Thumbnail picture -->
    <?= Html::img("@img-web-blog-posts/pic2.jpg"); ?>
</a>

<a href="<?= Yii::getAlias("@img-web-blog-posts/11/middle/pic3.jpg"); ?>" data-lightbox="roadtrip">
    <!-- Thumbnail picture -->
    <?= Html::img("@img-web-blog-posts/pic3.jpg"); ?>
</a>

您需要将 data-lightbox 属性设置为链接，并在 href 属性中设置图片的路径。如果您想设置图片组，那么请为每个需要的链接将 data-lightbox 属性设置为相同的名称。

缩略图图片，点击后打开小部件的链接

此小部件使用的插件 github 仓库的引用。

bajhoe / yii2-widget-lightbox2

维护者

详细信息

README

安装

用法