Wir verwenden Cookies, um Ihre Erfahrung zu verbessern. Um die neuen Datenschutzrichtlinien zu erfüllen, müssen wir Sie um Ihre Zustimmung für Cookies fragen. Weitere Informationen
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
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.
You can use all these classes together. Example below or on Sport Category