Articles in this category

Adding visual effects to your website

If you would like to add some dynamics to your site, have a lot of eye-catchy effects, different page elements floating in, splitting and flying around or you need some elements zooming in or changing their color on hover, you'll be able to easily do this using the Colors functionality from the sidebar.


How to add effects?

You'll find a full set of FX effects ready to be put into action. These are divided into four sections: Fade In, Rotate, Parallax, and Other (having Affix as the only one in this section as of now).

Now the most interesting part. To add the desired effect, you should drag and drop the effect icon to the area of a certain element. 

Effects.gif

After effect tips and tricks

Fade In is a cool effect to be used on an element or a block on your homepage, but it can quickly get annoying if you apply it to every page. Keep it cunning. Your site visitors shouldn't actually notice it as it should simply be a pleasant part of their experience.

Effects_Fade_in.gif

Rotate is another effect that enhances the visitors' interest in the content or the design of the website.

Effects_Rotate.gif

See below how Parallax effect works.

Effects_Parallax.gif

Affix helps you fix the position of the navigation section while allowing you to add vertical offsets to the fixed elements, depending on where the user scrolls. It can definitely keep your site visitors focused as they head down the page.

As you've noticed, the added effect is marked with a small red square with the FX letters on the upper right corner of the element area.

You need to access the website with the Public Mode for the effects to become visible as they do not perform in the Edit mode.

To remove the effect, just hover over the icon and press the Trash button.

Effects_Delete.gif

 

Did you find this resource helpful?
Return to top
Ready to get started
with Subbly?
Try for free