1. Oliver
  2. Sherlock Holmes The Voice
  3. Commercial Templates
  4. Tuesday, 23 April 2019
  5.  Subscribe via email
Hello Ciaran,

on Everly template you have several examples where the header_row is transparent, as long as you do not scroll down (Desktop view, not mobile!).
If I set the header background-color option in the template parameters to something like rgba(255, 255, 255, 0.5) I have transparency the whole time.

In your source code (e.g. in Example 3) you have this statement as inline CSS on line 326:


@media only screen and (min-width: 768px) {
.header_row, .header_top {
background-color: transparent;
}
}


I put this statement to my custom.css.
But it does not work.
If I set it to

background-color: transparent !important;

instead of

background-color: transparent;

I have transparency the whole time (again) ....

So for me it seems, you have written this @media css somewhere in the code of the page?

I tried the following solution:
I added it to Custom Code in the template configuration with a style tag around it.
But not only the part above with the background-color: transparent but the whole part of the css I found in your source-code of example-3:


<style>
@media only screen and (min-width: 768px) {
#container_header,
.sticky-wrapper {
position: absolute;
}
.header_row, .header_top {
background-color: transparent;
}
.layerslideshow698 .info {
opacity: 0;
transition: opacity .5s;
}
}
</style>


Now it works as I want it.
If needed, I can set transparent to something like rgba().
Maybe there is a better solutions so please feel free to correct me.

I have written this, because I think it may help others too.

Regards
Oliver
Accepted Answer Pending Moderation
0
Votes
Undo
Oh man, sometimes it's so easy :)

Thanks a lot!

Oliver
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Oliver

Would you have a URL to an example of this issue?

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ciaran,

its not really an issue, sorry for choosing it.

I only wanted to have the same effekt as on your demo page and I did not find out how to configure it (maybe there is a way but I am blind?).

So I checked the code in your example page and I found this CSS code

"@media only screen and (min-width: 768px) {..... " and so on...
that I explained above.

This code was not in my sourcecode of the template installation so I thought of how to implement it in a template-updateable way ;)
In custom.css it does not work, so I wrote it in the custom code passage of the template configuration. And to not have the effect on other pages than the startpage I copied the template and used the code only on startpage.
The page I used this solution is here: http://neu.mein-wenningstedt.de/
The page is still under development....

Regards
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Oliver

Thank you for detailing.

In your layer slideshow module, you will find an option in the General Setting tab titled Overlap Header if in showcase-1# module position. Setting this option to Yes should also give you the desired result.

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 4
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!

Join Our Newsletter

* indicates required
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.
Joomla51 - Mullaghmore, Co. Sligo, Ireland
Joomla51.com is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by
Open Source Matters
the trademark holder in the United States and other countries.

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.

Ok