Viewing 18 posts - 1 through 18 (of 18 total)
  • Author
    Posts
  • #769425

    I have the latest enfold version installed 4.04 and when I view the page on Android mobile devices (even the Google Chrome responsive emulator) the web site does not scroll down. I saw this post https://kriesi.at/support/topic/no-scrolling-on-apple-devices-with-enfold-4-0-2/#post-757707 which seems to have pointed to a problem caused by minifying CSS. However, I disabled caching and minify completely and the problem still exists. I cleared browsing history, page cache, etc.

    #769447

    Been looking for a cause and I think I may have stumbled upon one. In the color section above the fold I disabled “Display a scroll down arrow” and it seemed to solve the problem. This is because I noticed from the Google Chrome mobile emulator that when the scroll down arrow is enabled and displaying, a scroll bar was displaying on that color section only and it was changing in size with a frequency in sync with the scroll down arrow motion. This is what lead me to believe the scroll down arrow in the color section was the cause. I hope I was clear in explaining this, let me know if you need any more info. In any case could this be a bug caused by the scroll down arrow?

    • This reply was modified 7 years, 7 months ago by ifthenllc.
    #770507

    Hi,

    Please try the following in Quick CSS under Enfold->General Styling:

    #wrap_all { 
    overflow-y: scroll;
    }

    Best regards,
    Rikard

    #771039

    Hi Rikard,

    Thanks for the response. We tried that solution but it did not work for us, as we had read through your forums and found this solution elsewhere based on other very similar issues. At the moment we have un-checked the “Display a scroll down arrow” from the color section as described above. I hope this information helps.

    Best regards,
    Peter

    #771368

    Hi,

    To fix it, just add this custom CSS code at Enfold Theme Options > General Styling > Quick CSS

    
    @media only screen and (max-width: 767px) {
    #wrap_all { overflow: hidden; /*needed for mobile menu scrolling */ }
    }
    

    Best regards,
    John Torvik

    #771787

    Hi John, thank you for your attention. I am afraid this did not work either. If its of any help, we have a “boxed layout” with a background image. Maybe this combined with the “Display a scroll down arrow” enabled in the color section is causing the problem?
    Cheers,
    Peter

    #773324

    Hi ifthenllc,

    Could you please try clearing the cache on your device and also trying on other devices and get back to us with results.

    Best regards,
    Victoria

    #775977

    Hi Victoria,

    I tried this on Android device, Google Chrome developer tools (from the Chrome browser) and even a blackberry device browser. In all cases I deleted cache, browsing history and I even disabled the caching engine W3C on the site. Tested it thoroughly and the same result.

    Best,
    Peter

    #777248

    Hi ifthenllc,

    I checked today in Chrome and Safari mobile emulators and here. The page scrolls everywhere. I’ll ask my colleagues to test on an actual device and get back to you.

    Best regards,
    Victoria

    #777259

    Hey!

    We checked your site on the android device again and I was able to scroll to the bottom of the page without any issue. I took a screenshot of the section just above the footer please see below. I’m assuming it may be an issue relative to your device or some issue with caching on your device.

    Cheers!
    Vinay

    #777328

    Hi Victoria and Vinay.

    Thank you for taking the time to look into this.

    Yes it does work NOW because I applied a quick fix. See my second post above:

    The problem occurs when I enable “Display a scroll down arrow” in the top color section of the page. This is what was causing the scrolling to “freeze”. Whether I am caching the page or not, cleared browser history, this happens on multiple mobile devices.

    I have DISABLED the “Display a scroll down arrow” and replaced it with a down arrow link instead since we are currently running a campaign and we need the page to scroll. If you want to see the BUG in action we need to schedule a time for you to review.

    Thanks again.
    Peter

    #777840

    Hi!

    Glad you found a quick fix for the time being. We are a global team and we work 24/7 and attend all tickets on first come first serve basis. Once the campaign is over please let us know so we can check for the issue.

    Regards,
    Vinay

    #780689

    Hi Vinay,

    I have prepared a link (see private content) so you can see the behavior of this problem with the scroll down on Mobile devices. Please note:

    1. whether I have the caching on or off or disabled or removed, this problem persists.
    2. when I disable the option “Display a scroll down arrow” the problem disappears.
    3. this web site unlike others that we have created using Enfold, uses the “boxed layout” with a background image. The other web sites where I have the “Stretched layout” don’t have this issue with the “Display a scroll down arrow”.
    4. the two solutions offered above for #wrap_all did not solve the problem.

    I am running a campaign on the web site but not over this page. If you wish to look under the hood let me know.

    Best,
    Peter

    #782838

    Hi ifthenllc,

    Thank you for a demo page and a very detailed description of the “bug”. I think that for mobile devices the scroll down arrow is an overkill and can be disabled just for mobile devices. That way, you have a button on big screens and don’t have a scroll problem on mobile devices.
    What do you think?

    If you need further assistance please let us know.
    Best regards,
    Victoria

    #782861

    Hi Victoria, thanks for looking at this bug.

    I am not sure if the down arrow is an overkill, but are you suggesting a feature to disable the arrow on mobile devices?

    I am OK with the solution we have anyway.

    Best,
    Peter

    #784460

    Hi,

    if you wanna remove the down arrow for mobile only, then use this code inside Quick CSS field:

    @media only screen and (max-width: 767px) {
    a.scroll-down-link {
    display: none;
    }}

    Best regards,
    Andy

    #784618

    Thanks Andy, that worked good. You can see it in action on the link provided.

    #785508

    Hi,

    Great, glad we could help and thanks for the feedback. Please let us know if you should need any further help on the topic.

    Best regards,
    Rikard

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