Most gallery images in gallery page are inside a .d-style element for Dynamic Styling
For example:
html
<div class="pos-rel d-style overflow-hidden">
<img src="image.jpg" class="w-100 d-zoom-2" />
</div>
Because of .d-style and .d-zoom-2 classes, when you hover the image, it will be zoomed in, a little bit.
Or in this example:
html
<div class="pos-rel d-style overflow-hidden">
<img ... />
<div class="mt-hover position-tl w-100">
Some Buttons or Text
</div>
</div>
Because of .d-style and .mt-hover classes, when you hover the image, the .mt-hover element will appear from top
Please refer to its documentation or for an example see views/pages/gallery/@page-script.js
You should also include:
photoswipe/dist/photoswipe.cssphotoswipe/dist/default-skin/default-skin.css