Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • September 8, 2018 at 10:58 pm #1007500
    alinademi

    Hi Guys
    I have used these two snippets on Enfold documentation to make mobile header transparent and sticky.

    Header

    They work well but there are two issues:

    1. I want to hide entire menu when it is in transparent mode (including logo and menu icon).
    Exactly like desktop version.

    2. How to keep menu icon and logo to contain in the header once it appears on scroll. I made the header height smaller but can’t pull logo and menu icon up with it.
    Thanks.

    September 9, 2018 at 2:34 pm #1007593
    Vinay

    Hey alinademi,

    Thank you for writing to us.

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    CSS Snippet:

    
/* CSS - Display header when page scroll on mobile */

#header.av_header_transparency {
  display: none;
}

#header:not(.av_header_transparency) {
  display: block !important;
}

    Best regards,
    Vinay

    September 10, 2018 at 2:21 am #1007727
    alinademi

    Hi Vinay
    Thanks for the code. It solved problem no.1.

    For no.2

    (2. How to keep menu icon and logo to contain in the header once it appears on scroll. I made the header height smaller but can’t pull logo and menu icon up with it.)

    I tried this css on logo and it is now within the container.

    .responsive .logo img {
  max-height: 35px !important;
  top: -20px !important;
}

    But I couldn’t figure out a solution to do the same for Burger Menu Icon. please see the mobile version now. just want icon to go higher. Appreciate your help.

    Thanks.

    September 11, 2018 at 7:16 pm #1008532
    Victoria

    Hi alinademi,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 767px) {
  .responsive #top #wrap_all .main_menu {
      top: -20px;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    September 12, 2018 at 3:15 am #1008681
    alinademi

    Thanks Victoria,
    works like a charm!

    September 12, 2018 at 6:59 am #1008738
    Rikard

    Hi,

    Great, glad you got it working. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

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