The LightBox component is more powerful with the transition effects between images. This can be achieved through the easing property. Here, the default value is ease-out (that is, the effects are customized using the easing property). There are many other effects available, the entire list of CSS3 effects are supported. Also, by default, the effect duration is 500ms. This also can be customized through the effectDuration property.
The transition effect as an example of a LightBox with a collection of Angular conferences would be as follows:
<p-lightbox [images]="images" name="effects" easing="ease-out"
effectDuration="1000ms">
</p-lightbox>
The complete demo application with instructions is available on GitHub at
https://github.com/ova2/angular-development-with-primeng/tree/master/chapter6/lightbox.
https://github.com/ova2/angular-development-with-primeng/tree/master/chapter6/lightbox.
