logo-responsive
Welcome, Guest
Username: Password: Remember me

TOPIC: Image hover module - change default settings (solved)

Image hover module - change default settings (solved) 2 weeks 2 days ago #16235

  • Dari
  • Dari's Avatar
  • Offline
  • Fresh Boarder
  • Posts: 3
  • Karma: 0
Hello,
How to make the text be in the box on a dark transparent background (just like here) instead of the default setting without the background (like here).
I have a joomlage_0101 template.

Regards
The administrator has disabled public write access.

Image hover module - change default settings (solved) 2 weeks 2 days ago #16240

  • JohnO
  • JohnO's Avatar
  • Offline
  • Administrator
  • Posts: 5406
  • Thank you received: 876
  • Karma: 98
Hi Dari,

Please try the following solution.
Copy and paste the following css code into the custom css code parameter in the templates styling parameters.
figure.effect-lily h2, figure.effect-lily p {
    background-color: rgba(0,0,0,0.6) !important;
}
Thanks,
JohnO
The administrator has disabled public write access.

Image hover module - change default settings (solved) 2 weeks 2 days ago #16241

  • Dari
  • Dari's Avatar
  • Offline
  • Fresh Boarder
  • Posts: 3
  • Karma: 0
Thanks for your reply, but this is not working :-(
Below my custom css:

@media only screen and (max-width: 380px) {

/* Adjust Text size in imagehover module */

figure h2 {
font-size:15px !important;
}

figure p {
display: none !important;
}
figure.effect-lily h2, figure.effect-lily p {
background-color: rgba(0,0,0,0.6) !important;
}
}

Regards,
Dari
The administrator has disabled public write access.

Image hover module - change default settings (solved) 2 weeks 2 days ago #16242

  • JohnO
  • JohnO's Avatar
  • Offline
  • Administrator
  • Posts: 5406
  • Thank you received: 876
  • Karma: 98
I see your issue. You put it into the existing css media query. Its needs to be outside the last curly bracket.

It all should look like this. Simply remove all your existing css and replace with the following.
@media only screen and (max-width: 380px) {

/* Adjust Text size in imagehover module */

figure h2 {
font-size:15px !important;
}

figure p {
display: none !important;
}
}

figure.effect-lily h2, figure.effect-lily p {
background-color: rgba(0,0,0,0.6) !important;
}

Thanks,
JohnO
The administrator has disabled public write access.

Image hover module - change default settings (solved) 2 weeks 2 days ago #16243

  • Dari
  • Dari's Avatar
  • Offline
  • Fresh Boarder
  • Posts: 3
  • Karma: 0
Works Perfect! - Thank You ;-)
The administrator has disabled public write access.

Image hover module - change default settings (solved) 2 weeks 2 days ago #16244

  • JohnO
  • JohnO's Avatar
  • Offline
  • Administrator
  • Posts: 5406
  • Thank you received: 876
  • Karma: 98
You are welcome,

Thanks,
JohnO
The administrator has disabled public write access.
Time to create page: 0.229 seconds
Powered by Kunena Forum

Newsletter




We respect your privacy and do not tolerate spam and will never sell, rent, lease or give away your information (name, email, number, etc.) to any third party. Nor will we send you unsolicited email.

Use code   APRIL20 at checkout

    APRIL    

10% off Everything!

We use cookies on our website. Some of them are essential for the operation of the site, while others help us to improve this site and the user experience (tracking cookies). You can decide for yourself whether you want to allow cookies or not. Please note that if you reject them, you may not be able to use all the functionalities of the site.