megaGlider Stack Tutorial
In this brief tutorial, we'll show you how to set up 2 complete megaGlider galleries: one for images alone and another for mixed content.
You can download this tutorial and sample RW project to play with it and study more closely how the gliders were put together.
You can download this tutorial and sample RW project to play with it and study more closely how the gliders were put together.
The first thing you need to do is add a Stacks page to your project and then drop the megaGlider Stack. Your window will look like the screenshot below. If not, go to Page Inspector>Page and check "Render HTML in Edit mode."
The first example will show you how to create a glider using only images. In the next example, we'll show you how to create a glider with mixed content, i.e. images and text.
To create a glider with only images, drop an Image Stack in each of the "Drop stacks here" areas. Your page will look like this:
To create a glider with only images, drop an Image Stack in each of the "Drop stacks here" areas. Your page will look like this:
Next, drag and drop images to the image wells. It works much better if all the images have the same size and shape... Below is a partial screenshot:
Finally, select your options in the HUD (info box) and you're done.
For this example, we used the settings shown on the left. In addition, using the standard controls at the top of the HUD, we set the Width to 75% to push the images closer together. In addition, we've added some margins and paddings to allow the images to remain visible throughout the animation "shape."
The Glider Height was set to make sure that the items will be entirely visible within the glider's virtual container.
For this example, we used the settings shown on the left. In addition, using the standard controls at the top of the HUD, we set the Width to 75% to push the images closer together. In addition, we've added some margins and paddings to allow the images to remain visible throughout the animation "shape."
The Glider Height was set to make sure that the items will be entirely visible within the glider's virtual container.
Here's the actual megaGlider Stack in action:
To create a glider with mixed content, start by dropping Text Stacks in each of the "Drop stacks here" areas, drag and drop some images, format your text, etc. Your page will look like this:
Finally, select your options in the HUD (info box) and you're done.
When working with mixed content, only the Item Width must be set. The height of the item will be adjusted automatically to fit its content.
Notice that we deselected Allow Scaling to prevent the items from being cropped.
When working with mixed content, only the Item Width must be set. The height of the item will be adjusted automatically to fit its content.
Notice that we deselected Allow Scaling to prevent the items from being cropped.
Here's the second actual megaGlider Stack in action.
Now start playing by changing any settings, Shape, Transition, Tilt, Transition Speed, Glider Height, etc. to see just how many variations are available...
Important tips to remember:
When working with mixed content, only the Item Width must be set as the Height setting will be ignored and the height of the item will be adjusted automatically to fit the content.
As mentioned on the info page, Allow Scaling should NOT be checked for gliders that use mixed content otherwise, items in the background will be cropped.
Finally, the megaGlider Stack uses sophisticated effects and animation paths therefore, it can create hundreds of variations. With that in mind, at times, items might extend beyond the virtual container that holds the glider. If that happens, you can apply margins or paddings as needed using the standard settings located on the top part of the HUD (info box).
Keep in mind that you can add links to any text or images in the glider...
When working with mixed content, only the Item Width must be set as the Height setting will be ignored and the height of the item will be adjusted automatically to fit the content.
As mentioned on the info page, Allow Scaling should NOT be checked for gliders that use mixed content otherwise, items in the background will be cropped.
Finally, the megaGlider Stack uses sophisticated effects and animation paths therefore, it can create hundreds of variations. With that in mind, at times, items might extend beyond the virtual container that holds the glider. If that happens, you can apply margins or paddings as needed using the standard settings located on the top part of the HUD (info box).
Keep in mind that you can add links to any text or images in the glider...
