fnaf.swiki.jp - The menu from the header occasionally blinks when scrolling up the page.

[webcompat-bot]

URL: https://fnaf.swiki.jp/

Browser / Version: Firefox Mobile 68.0 Operating System: Android Tested Another Browser: Yes

Problem type: Site is not usable Description: scroll problem Steps to Reproduce: I am reporter of #43329. In that page,there is no problem when I'm scrolling down.However,when scrolling up,the page header blink and the page give no reaction to my scrolling for a while. I deleted all Cookie,disabled all addons,and initialized all setting(I have never change about:config),but the problem is still there. I'm using latest stable Firefox for Android. Also,I tried the page on latest stable Firefox Focus and found same behavior. On Google Chrome,I can scroll properly. I am so sorry for making unkind report in #43329,and for my unnatural English(I am not native English speaker).

Browser Configuration

• None

From webcompat.com with ❤️

[miketaylr]

Thanks for the report, and for testing in Firefox Focus. Does the issue reproduce in Firefox Preview? https://play.google.com/store/apps/details?id=org.mozilla.fenix&hl=en_US

[cipriansv]

@miketaylr, I was indeed able to reproduce the issue on both Nightly and Preview Nightly. The menu from the header occasionally blinks when scrolling up the page.

Tested with: Browser / Version: Browser / Version: Firefox Nightly Mobile 68.3a1 (2019-11-18), Firefox Preview Nightly 191118 (🦎: 72.0a1-20191115095319), Chrome Mobile Chrome Mobile 78.0.3904.96 Operating System: Huawei P10 (Android 9.0) - 1080 x 1920 pixels (~432 ppi pixel density)

Moving the issue to needsdiagnosis.

[karlcow]

The issue is happening only when the full page is not yet completely loaded. Once this is loaded. Everything works as it should. The difference is chrome seems to be better at doing that. There are a lot of ads on this page. (230 requests and 9.08MB)

but indeed sometimes there is a flash on the header.

<div class="navbar-func" style="height: 1px; padding-top: 0px; margin-top: 0px; padding-bottom: 0px; margin-bottom: 0px; display: none;">

…

</div>

scrolling adjusts the value on this style attribute, including the visibility, hence the flash.

$(document).ready(function () {
    var timer = false;
    var tmp = $(window).scrollTop();

    $(window).on("scroll touchmove", function () {
        var pos = $(window).scrollTop();

        if ($(".navbar-func").is(":hidden")) {
            if (tmp > pos || 100 > pos) {
                if (timer !== false) {
                    clearTimeout(timer);
                }

                timer = setTimeout(function () {
                    $(".navbar-func").stop().slideDown();
                }, 10);
            }
        }
        else if ($(".navbar-func").is(":visible")) {
            if (tmp < pos && 100 <= pos) {
                if (timer !== false) {
                    clearTimeout(timer);
                }

                timer = setTimeout(function () {
                    $(".navbar-func").stop().slideUp();
                }, 10);
            }
        }

        tmp = pos;
    });

And Chrome seems to be better at handling this case.

[karlcow]

Close as duplicate of https://bugzilla.mozilla.org/show_bug.cgi?id=1599004

[lock[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue at https://webcompat.com/issues/new if you are experiencing a similar problem.