lots of variations

CMS Banners

You can add various hover animations by adding following classes to banner wrapper:

ox-zoom-hover orox-zoom-out-hover - to zoom the whole banner on hover or out.

ox-img-zoom-hover or ox-img-zoom-out-hover - to zoom only image on banner hover or out.

Align Content in banner by adding following classes (horizontal and vertical): h-center, h-left, h-right, v-bottom, v-top, v-center


Content Overlay Image


Show content on hover

Add class ox-show-hover to hide element and show it on hover.
Additionally add class ox-moveup-hover animate it from bottom on hover.


Overlay color on hover

Add div with class overlay-layer inside ox-banner-link to add overlay layer
and class overlay-hover to banner wrapper for hover overlay animation.


Overlay color and content on hover

Change ox-banner-link selector to div if you want to add mutliple buttons with different links in content.


Content Below Image

compare and shop
compare and shop
compare and shop

Animated Text Banner


Add class ox-banner-medium, ox-banner-big or ox-banner-huge for bigger text and paddings:


Overlay Banner Variations


Two Contents in Banner

Add class top or bottom to content container (ox-banner-container) for positioninng.


Banner and Image Stretch

Add class banner-stretch and banner-stretch-v or banner-stretch-vertical to banner wrapper to fit stretch banner to fit container size.

Add class image-cover to banner wrapper to name image cover banner container even if it is smaller than banner.

limited time offer

on new collection

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.

shop now

To Top
0 Cart