Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #752013

    Hi!

    I have search the forum and found several ways to reduce the opacity of the main menu, but the css codes i’ve tried will reduce the opacity after scrolling (with fixed header) only.

    I’m looking foor a way to reduce the trancparancy of the fixed menu. :)
    Here is an example of what i would like to achive; https://www.lamborghini.com/en-en/

    #752022

    Hi jockejansson!

    We checked your example, thanks a lot for describing so good.
    Can you also provide us a link of your web site please?

    Thank you

    Regards,
    Basilis

    #752029

    Hello Basilis!

    Of course, here the example site: http://tornbybilvard.se/tjanster/

    Using this code:

    #header{
    opacity: 0.6;
    }

    • This reply was modified 7 years, 1 month ago by jockejansson.
    #752040

    Hi,

    Can you please also disable maintenance so we can work?
    Tbhank you very much

    Best regards,
    Basilis

    #752042

    Done!

    sorry! :)

    #752050

    Done! Sorry! :)

    #752058

    Hey!

    Here is the CSS

    #top .av_header_transparency #header_main {
    background: rgba(2,2,2,0.1) !important;
    }

    You can change the colors with something else if you want.

    Thanks a lot

    Regards,
    Basilis

    • This reply was modified 7 years, 1 month ago by Basilis.
    #752060

    Thanks Basil for the code, but unfortunately it wont do the thing!
    Basicly i would like to have a sticky menu that is permanent transparent.

    The code you gave me will make the menu transparent until i scroll down, when it turns solid again.

    • This reply was modified 7 years, 1 month ago by jockejansson.
    #752595

    Sorry to bump, but may i ask someone to have a look into this again? :)

    #753537

    Hi,

    I have checked it but it seems you have already done it, if not you can try this css code:

    #top .header_bg {
        background: rgba(0, 0, 0, 0.5) !important;
    }

    Best regards,
    Nikko

    #753714

    Hi Nikko, yes i did found a solution that works pretty well.
    Tough there is still a minor issue, regarding specifik pages where i do not want the transparent header. Since the css code is overriding the global theme settings…

    I guess i need specific css to that specific page?

    #756452

    Hi,

    Please use the page ID class name which can be easily found in the body tag when you right click on the page and inspect it. The css class name will look similar to page-id-xx where xx is the number.

    Use this page/post ID class name to target the specific pages and change the css code for the header as you like.

    #top.page-id-xx .header_bg {
        background: rgba(0, 0, 0, 0.5) !important;
    }

    Best regards,
    Vinay

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.