Problem with mobile res

  • Resolved energo

    (@energo)


    8 years, 2 months ago

    As my previous problem was resolved so fast I decided to ask about one more bug with my site ??
    With handheld menu nearly everything works fine. I see a “ghost” MENU floating with scroll-down and it works if I click it. The only one problem is that at the very beginning of scroilling down something happens with header area. It risezes in height and I can even catch it “beating” up and down.
    Would you be so kind to check this bug too?
    Thx

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter energo

    (@energo)

    Something changes a little if I choose the legacy mode with Dynamic mode but this does not fully fix it. Just maybe the “beating” factor is eliminated. I can still see how menu disappears and appears again with the header area resize.

    Sorry, I’m not entirely sure what the issue is, or what you mean by “beating”. Can you please list the exact steps that need to be taken to reproduce this problem?

    Do you mean that when you scroll down, the word “MENU” disappears from view and then once the scrolling ends, it appears in it’s sticky spot?

    Thread Starter energo

    (@energo)

    1) reduce the browser window to the size when handheld menu appears switching the main primary menu.
    2) Try to scroll-down the page slowly and you will see the bug. Must see. I use Chrome. Will test now with Edge

    Thread Starter energo

    (@energo)

    The same with Edge. This is the moment whgen Logo disappears and header area appears only with MENU at the top. Don’t know how to explain it better.

    Seeing the issue now.

    Can you try changing the setting for the sticky element in the plugin settings? Instead of using “.storefront-primary-navigation“, please try “.petshop-primary-navigation“.

    If that doesn’t work, try adding this CSS code:

    @media (max-width: 767px) {
    .site-search {
        clear: both;
        width: 100%;
        height: 1px;
        display: block;
        overflow: hidden;
    }
}
    • This reply was modified 8 years, 2 months ago by Senff - a11n.

    Correction:

    @media (max-width: 767px) {
    .site-search {
        clear: both;
        width: 100%;
        height: 1px;
        display: block;
        overflow: hidden;
        visibility:hidden;
    }
}

    Please make sure that whichever solution you pick of these two, everything still works on larger screens as well.

    Thread Starter energo

    (@energo)

    I tried the second code and it fixed the problem as I can see.
    Thank you very much.

    Awesome, glad that got fixed as well!

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Problem with mobile res’ is closed to new replies.