Animation & Other parameters

Animation Type

Choose one of our 9 pre-defined animation skin or create a new one. The CSS3 and the transform animations are very special and they are not supported in older browsers!

Animation

  • Duration: You can define the opening and closing duration in millisecundums.
  • Open easing: Specifies the opening speed of the animation progresses to make them look more realistic.
  • Close easing: Specifies the closing speed of the animation progresses to make them look more realistic.
  • This page will help each time to pick the desired easing function: http://easings.net/

Snap submenus to bottom

This parameter changes the animation a bit, because the submenus’ opening and closing effect will be given here to the bottom menu item.

CSS3 animations

This enables the CSS3 transitions for the animations if the browser supports it. If not, the default javascript animation will be used.

Transform

With this parameter you can turn the transform CSS on and off, but the 6 parameters below doesn’t work without this parameter. You have to turn on this option for the following parameters: Opacity, Perspective, Origin, Translate, Scale and Rotate.

Opacity

You can set a value between 0 and 1 which determine the fading of the menu during the animation.

Perspective

The perspective property defines how many pixels a 3D element is placed from the view. This property allows you to change the perspective on how 3D elements are viewed.

Origin

The transform-origin property allows you to change the position on transformed elements. 2D transformed element can change the x- and y-axis of the element. 3D transformed element can also change the z-axis of the element.

Translate

Moves an element sideways or up and down.

Scale

The scale increases or decreases the size of element.

Rotate

Rotates clockwise from current position.

Other parameters

Menu class suffix

You can add a CSS class to our menu, so you would be able to identify it with your custom code.

HTML5 mode

It will add a nav HTML5 tag to show the navigation for Google. It is a SEO friendly setting.

Show expanded when Javascript disabled

If you turn this option on, your menu will be defaultly opened, and when our javascript code is loading, that will close it, so if the javascript is disabled in the browser, the menu will stayed opened. But this could cause a problem, that when you are loading your website, the menu will "flicker", that you will see it opened, until our javascript code doesn't run