Additional Gallery Animations

Ask the community
, ,
1

Hi,

I’m not sure how much this question has to do with Wix corvid.

Currently, I have a collage (pro gallery) on a page of my wix website. It is filled with the images that I need to show, and it is set up properly. I would like to know if there is a way to access additional animations. What I’m trying to do is this: when I click on an image in the collage, I want the image to expand (not referring to the “Open in Expand” option here). I want the image to pop up or appear larger than the other images in the collage on the same page until another image is selected.

I’ve visited the Wix App Market, and I’ve seen a few applications that could possibly help. However, there is no way to see whether these applications have what I need without purchasing them beforehand.

Any help is appreciated!

2

Firstly, if you are wanting to populate a gallery with images from a dataset, then just use a gallery and do not use a pro gallery.

Secondly, Wix Support also already do support pages for Wix Gallery and Wix Pro Gallery.
https://support.wix.com/en/the-wix-editor/gallery
https://support.wix.com/en/the-wix-editor/pro-gallery

You can also add animations through code as shown here.
https://www.wix.com/corvid/reference/$w.EffectOptions.html

You can also make up your own gallery instead of having it through a gallery app from Wix with thumbnails shown only on a page and then an enlarged version of each picture hidden on load and only shown on the same page when the user clicks on the thumbnail image etc.

have a look at the gallery api reference.
https://www.wix.com/corvid/reference/$w.Gallery.html

3

You can also do a simple gallery using a gallery and code, something like this.

905×443 287 KB

THE ELEMENTS

The Page
Image Gallery: #gallery1
(DO NOT USE Wix Pro Gallery)
Text Elements:
#title
#description

The Database
Create a database: Menu (dynamicDataset)
​Recommended fields:
Menu Name Field: menu
Menu Description Field: description
Image Fields: image1, image2, image3, image4, image5, image6
Image Title Fields:image_title1, image_title2, image_title3, image_title4, image_title5, image6
Image Description Fields: image_desc1, image_desc2, image_desc3, image_desc4, image_desc5, image_desc6
Create a dynamic page and link your database fields.

The Dynamic Page
Create a dynamic page: Menu (Title)
​Link fields on dynamic page to your database.​

THE CODE

Page Code

$w.onReady(function () {
​
    let item = $w("#dynamicDataset").getCurrentItem();
    $w("#gallery1").items = [
    {src: item.image1, title: item.image_title1, description: item.image_desc1},
    {src: item.image2, title: item.image_title2, description: item.image_desc2},
    {src: item.image3, title: item.image_title3, description: item.image_desc3},
    {src: item.image4, title: item.image_title4, description: item.image_desc4},
    {src: item.image5, title: item.image_title5, description: item.image_desc5},
    {src: item.image6, title: item.image_title6, description: item.image_desc6}
];
});