Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • March 6, 2015 at 11:32 am #406920
    PeterTLH

    Hello,

    I want to header to be visible 100 percent and remove any form of transparency (logo and menu area).

    When a visitor scrolls on the website, I want the main area to dissapear under the header and not be visible anymore. Not even a bit

    How can I achieve this?

    Greetings,

    Peter

    March 6, 2015 at 12:15 pm #406936
    begrafiks

    Hi PeterTLH ;
    #1 “I want to header to be visible 100 percent”
    While creating “your page” you can chose “Header visibility and transparency”.

    #2 “I want the main area to dissapear”
    Go to Theme settings > Header

    Here is an image http://i.imgur.com/TLEgh2p.jpg

    March 6, 2015 at 12:50 pm #406950
    PeterTLH

    Hello,

    thanks for your reply.

    On my pages I have set the header visibility and transparency to “No transparency”. So that setting is ok.

    Still when I scroll I see a little of the page content through the menu and logo area.

    March 6, 2015 at 6:52 pm #407199
    Yigit

    Hi!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    #header.header-scrolled { background-color: white; }

    You can change “white” into the background color of your header

    @begrafiks     thanks! :)

    Regards,
    Yigit

    March 6, 2015 at 8:46 pm #407262
    PeterTLH

    Hello,

    used that piece of code in Quick CSS but I still see the main page content under the menu and logo when I scroll :(

    Greetings,

    Peter

    March 7, 2015 at 5:13 pm #407514
    Yigit

    Hey!

    Can you post the link to your website please?

    Regards,
    Yigit

    March 10, 2015 at 12:15 pm #408761
    PeterTLH

    Hello Yigit,

    that is not possible because I am designing the website on our local NAS.

    Can I provide you with some sort of code / information / printscreens?

    Greetings,

    Peter

    March 10, 2015 at 12:37 pm #408767
    Yigit

    Hey!

    Sure, please post a screenshot of the header when its scrolled down. You can upload your screenshots on imgur.com or Dropbox public folder and post the links here

    Regards,
    Yigit

    March 10, 2015 at 12:50 pm #408774
    PeterTLH

    Hello,

    here is a link with 2 printscreens: 1 not scrolling at all and one scrolled.

    https://www.dropbox.com/sh/jfnlgbdjmm6xgp1/AADESIj54e49Mk-AL2DYwobba?dl=0

    Greetings,

    Peter

    March 10, 2015 at 1:10 pm #408785
    Yigit

    Hi!

    Please try using following code 

    header#header {
  background: white;
}

    Cheers!
    Yigit

    March 10, 2015 at 1:16 pm #408791
    PeterTLH

    Thanks. That did the trick. The code I tried before “#header.header-scrolled { background-color: white; }” did not work. The last code did!

    Greetings,

    Peter

    March 10, 2015 at 1:19 pm #408793
    Yigit

    Hi!

    For future readers, previous code would work if you enabled shrinking header option in Enfold theme options > Header > Header Behaviour.
    You are welcome, glad we could help! Let us know if you have any other questions or issues :)

    Cheers!
    Yigit

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘How to change header to non transparent?’ is closed to new replies.