CODEWITHSUNDEEP
javascriptjqueryflashflickersmooth-scrolling
Carlos Ramos
Carlos Ramos

Reputation: 11

Screen flashes before scrolling

I used jQuery to load a new page and scroll to a specific div. Everything worked perfectly but I have a small problem. Every time the link opens right before it scrolls there is a flashing.

Here is the code:

<a id="about1" href="Main.html#aboutSection" alt="About"> ABOUT </a></li>

here is the script:

$(document).ready(function() {
$('html, body').hide();

if (window.location.hash) {
    setTimeout(function() {
        $('html, body').scrollTop(0).show();
        $('html, body').animate({
            scrollTop: $(window.location.hash).offset().top
        - 86}, 1000)
    }, 0);
} else {
    $('html, body').show();
} )};

I hope was clear enough.

Thanks guys.

P.S: I am new to web programming. This code is not mine.

Upvotes: 1

Views: 472

Answers (1)

Branden Slocum
Branden Slocum

Reputation: 41

You are seeing a blink because you are hiding all your contents with:

$('html, body').hide();

Is there a reason you want to hide the whole page? If not you can just try the following

$(document).ready(function() {

    if (window.location.hash) {

      $('html').animate({
        scrollTop: $(window.location.hash).offset().top
      - 86}, 1000);
   }
});

Upvotes: 2

Related Questions