Tagged: , ,

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #702001

    Good morning!

    I am fairly certain this is not currently implemented functionality, but am looking to see if the existing sticky header code can be re-purposed to achieve the following:

    – In the “Logo Left; Menu Below” header layout, both the logo area and the menu bar below it are stickied to the top of the window
    – I would like to have both of these items scroll with the page, but the menu would stick to the top of the page

    An example of a theme that performs what I’m looking for, is the Sport theme by ThemeCanon. Here is a link to a demo site of theirs (hopefully it links properly): http://bit.ly/2ep8Kx0

    I am comfortable with Javascript, PHP and CSS, and will be looking to solve this on my own, but any knowledge/assistance from the Kriesi devs would be more than welcome.

    Thank you from Canada :)

    #702198

    Hi Phil,

    Could you post a link to the site in question so that we can take a closer look please?

    Regards,
    Rikard

    #702458

    I’ve provided (privately) links to the website I’m working on.

    #703185

    Hi,

    Please enable the “Shrinking Header” option in the Enfold > Header > Header Behavior panel. And then add the following css code.

    .header-scrolled #header_main .av-logo-container {
        display: none;
    }

    I know that you don’t need a shrinking header but turning that option will enable us to use a custom class attribute called “header-scrolled” which is added to the header container on scroll.

    Best regards,
    Ismael

    #908755

    Greetings!
    Code works on desktop, but logo still showing on tablets. Is there some solution to hide logo area on them?

    #908758

    Or, maybe, there is a way to disable floating header on tablets resolutions?

    #908927

    Hi MAXENws,

    Could you post a link to the site in question so that we can take a closer look please?

    Best regards,
    Rikard

    #909249

    Hello!
    Current project in development state: http://dev.plittorg.in.ua/

    As you see, in higher resolutions everything working nice, but when you look at it with, shall we say, iPad resolution, we see that logo area and widgets in it isnt hiding (just dont forget to reload the page after switching to iPad resolution in browser).

    Code I use:

    .header-scrolled #header_main .av-logo-container, .header-scrolled div#search-3, .header-scrolled div#text-2, .header-scrolled div#text-3 {
        display: none!important;}

    What I need is to make logo area hide aswell on tablets resolutions, or disable floating header only for them.

    • This reply was modified 6 years, 9 months ago by MAXENws.
    #909553

    Hi,

    The header is not sticky or fixed. Did you disable the option? Please post the login details in the private field so that we can inspect it.

    Best regards,
    Ismael

    #909684
    This reply has been marked as private.
    #909756

    It seems like .header-scrolled isnt the right property for tablets resolution. It just don`t make any effect on tablets after you refresh the page.
    I suppose, if you tell me what property makes sub menu hide on tablets in css I will manage to make it work properly.

    #910193

    Hi,

    Why do you need to hide the logo on scroll? The header is not fixed or sticky on mobile devices so users won’t be able to see the logo on scroll.

    Best regards,
    Ismael

    #910220

    Hi.
    I see you just didnt look at site on tablet resolution. There is link for screenshot: https://drive.google.com/open?id=12YB2mhm7SL5Ou7hQBnCZ317RJLZa_X-i And than is only reason I need to hide logo on scroll on tablets.

    #910869

    Hi,

    Yes, that’s how it looks on iPad view but the header is not fixed or sticky. If you really want to remove the logo, use this.

    @media only screen and (max-width: 1024px) {
        #header_main .av-logo-container {
            display: none;
        }
    }

    Best regards,
    Ismael

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