Return to previous page

Banner mask design requirement - by Anand

This topic has 4 replies, 3 voices, and was last updated 3 years, 6 months ago ago by Rose Tyler

  • Avatar: Anand
    Anand
    Participant
    September 21, 2020 at 13:16

    Hi Sir,

    how to show text visible onmouseover only from banner mask..

    http://nextgenprint.com/demo/
    please check home page our products section..

    #252069 Copied Theme version: 7.0
    3 Answers
    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    September 21, 2020 at 17:02

    Hello,

    Add the banner content and then add the below custom to Theme Options > Custom CSS

    .banner .banner-content .content-inner {
    opacity: 0;
}
.banner:hover .content-inner {
    opacity: 1;
   color: #fff;
}

    Regards

    #252112 Copied
    Avatar: Anand
    Anand
    Participant
    September 24, 2020 at 06:52

    Not working

    Please contact administrator
    for this information.
    #252442 Copied
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    September 24, 2020 at 07:59

    Hello,

    Please change the previous code to:

    .banner .banner-content {
    opacity: 0;
}
.banner:hover .banner-content {
    opacity: 1;
}

    Regards

    #252451 Copied
  • Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

Useful links WooCommerce & WordPress

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder
Tea Store – WordPress WooCommerce Theme
lazy-placeholder
Mango – Responsive eCommerce PSD Template
lazy-placeholder
WooPress Fullwidth
lazy-placeholder
Flowers Store – WordPress WooCommerce Theme
lazy-placeholder
Minimal Fashion 02 Store – WordPress WooCommerce Theme
lazy-placeholder
Dokan Multivendor Marketplace – WordPress WooCommerce Theme
lazy-placeholder
Minimal Fashion 03 Store – WordPress WooCommerce Theme
lazy-placeholder
Corporate – WordPress WooCommerce Theme
lazy-placeholder
Organic Store 01 – WordPress WooCommerce Theme
lazy-placeholder
Online Courses – WordPress WooCommerce Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.