https://github.com/coderius/yii2-lightbox2-widget

The Yii2 Lightbox2 widget is a customized lightbox script.
https://github.com/coderius/yii2-lightbox2-widget

lightbox lightbox2 lightbox2-widget yii2 yii2-lightbox2-widget

Last synced: 10 months ago
JSON representation

The Yii2 Lightbox2 widget is a customized lightbox script.

• Host: GitHub
• URL: https://github.com/coderius/yii2-lightbox2-widget
• Owner: coderius
• License: other
• Created: 2018-07-01T17:49:41.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2023-05-11T07:54:29.000Z (over 2 years ago)
• Last Synced: 2025-03-25T08:51:20.355Z (10 months ago)
• Topics: lightbox, lightbox2, lightbox2-widget, yii2, yii2-lightbox2-widget
• Language: PHP
• Homepage:
• Size: 328 KB
• Stars: 2
• Watchers: 0
• Forks: 5
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

          
Lightbox2 widget for Yii2

=========================

The Lightbox2 widget is a customized lightbox script based on [Lightbox](https://lokeshdhakar.com/projects/lightbox2/). and 

This widget used to overlay images on top of the current page. 

![alt text](https://github.com/coderius/github-images/blob/master/pic1.png "Description goes here")

Installation

------------

The preferred way to install this extension is through [composer](http://getcomposer.org/download/).

Either run

```

php composer.phar require coderius/yii2-lightbox2-widget "@dev"

```

or add

```json

"coderius/yii2-lightbox2-widget" : "@dev"

```

to the require section of your application's `composer.json` file.

Usage

-----

* In view:

```php

use coderius\lightbox2\Lightbox2;

= coderius\lightbox2\Lightbox2::widget([

    'clientOptions' => [

        'resizeDuration' => 200,

        'wrapAround' => true,

        

    ]

]); ?>

" data-lightbox="roadtrip" data-title="some title" data-alt="some alt">

    

    = Html::img("@img-web-blog-posts/pic.jpg"); ?>



" data-lightbox="roadtrip">

    

    = Html::img("@img-web-blog-posts/pic2.jpg"); ?>



" data-lightbox="roadtrip">

    

    = Html::img("@img-web-blog-posts/pic3.jpg"); ?>



```

You need set data-lightbox attribute to link and path to image in href attribute. If you wanna 

to set group images, then put identic names to data-lightbox attribute for each needed link. 

*Thumbnail picture, by clicking on which opens the widget is wrapped with a link

 

Reference to plugin [github](https://github.com/lokesh/lightbox2/) repository that is used in this widget.