Creating a simple popup
In this tutorial you can learn how to create a simple popup within the slider area using Smart Slider 3's events. If you're looking to create an actual lightbox, look at the Link options instead.
- 1
-
Creating the IN event
Go to one of your slides (or create a new one), and add a new button layer. Go to the Layer Window → Animation tab and click on Events. Name your event by writing its name to the Click field. I'll go with
popup
. - 2
-
Creating the visual popup
Put down as many layers as you need to create the popup content. You are free modify and customize them at this step. I'll add a new row which has heading, a text and an icon layer. I'll arrange these layers to entirely cover my button layer, so I have use an Absolute row on my slide.
- 3
-
Creating the IN animations
I'll go to the row layer's Animation tab and add a new IN animation. I pick Fade at the Fade group, which will look perfect for what I'm trying to create.
Turn on the Repeatable option for this layer. Then write the previously used event trigger (in my case,
popup
) to the Plays in when field at the Events tab.Now if you preview the slide you can show this popup by clicking on your button.
- 4
-
Creating the OUT animation
Staying at the layer's Animation tab, let's add an OUT animation. Again, I pick Fade. Now the only remaining task is creating an event for this animation. Head to Events again, and write
popdown
to the Plays out when field. - 5
-
Triggering the OUT animation
At this point we have a working in event and an out event that needs a trigger. Select the layer which you want to close the popup (in my case this is an icon layer), and write
popdown
to its Layer window → Animation tab → Events → Trigger custom event on: Click field.
That's it, the popup is working now. If you like to see things visually, here's a quick video which you can watch to understand the written instructions better.