Page jumps before scrolling smoothly

  • Resolved Dima Stefantsov

    (@dima-stefantsov)


    6 years, 8 months ago

    There was a topic with same name a year ago, this is still an issue.

    https://dima.stefantsov.com/tools/

    For example, try clicking on link “Skype”, you will see a flash of face screenshot, then it will scroll to that screenshot like it should.

    This might be important for debug: if you keep clicking same anchor link, skype, scroll up, skype, … then it only flickers the first time, next times it scrolls like it should, without flashing of destination content. If you change links: skype, scroll up, notepad 2, scroll up, skype, … it will flash the destination content every time.

    This should not be some fundamental browser thing, it’s a bug in code. I can see it in Chrome, IE, Firefox, 100% browsers I tested. Both desktop and mobile.

    The bug: Instantaneous jump to destination, like without your plugin, then screen is back where it was, smooth scroll to destination. Please fix. It is important for me to not have flickers of content on my site.

    The page I need help with: [log in to see the link]

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

    (@dima-stefantsov)

    And while you are at it, could you please let us change scroll duration?
    I see you do it inline in js, having a filter would not be hard to do:
    have a js variable that would be printed above your script, let your script use this variable.

    If it’s hard for you to implement, it’s ok, just make a check in js, “if such global variable is declared, use it, if not, use default 900”.

    Thread Starter Dima Stefantsov

    (@dima-stefantsov)

    I specifically want to set it to 0, jump instantly. Just preserve the offset, and page reload jump.

    Thread Starter Dima Stefantsov

    (@dima-stefantsov)

    Have tried to hardcode 0 instead of 900, it stops working if 0. 1 works but still not instant.

    Plugin Support Michael Beckwith

    (@tw2113)

    The BenchPresser

    Acknowledging this as seen, but I need a bit of time before I can really attempt diving in to seeing what’s going on with it. Not able to at the exact moment.

    Thread Starter Dima Stefantsov

    (@dima-stefantsov)

    shift is happening on window.location.hash = hash;
    I currently hack it with
    1. scroll as I want it
    2. window.location.hash = hash;
    3. window.scroll(0, same_offset_as_[1])

    This way [2] is not noticeable. Still, it’s some weird hacks. As weird as having to use setTimeout in jquery.ready.

    Plugin Support Michael Beckwith

    (@tw2113)

    The BenchPresser

    Are you still “battling” with this one, or did you decide to move on? Asking because I re-visited the site originally linked and wasn’t seeing any of the plugin’s js at the moment.

    Thread Starter Dima Stefantsov

    (@dima-stefantsov)

    I have implemented it on my own, based on your solution, but with smaller and simpler code, also hardcoded values, no plugin interface.

    I’m still not happy with needing to jquery.ready (settimeout), it doesn’t seem right. If you could make it fundamentally better, I would be great. Otherwise, I’m staying where I am now.

    You could also implement it in your code if you want. window.location.hash = hash; moves the window. If you want to have smooth scrolling, probably a fix to flash would be
    startpos = remember_pos();
    window.location.hash = hash;
    window.scroll(0, startpos);
    default_animate_scroll();

    Thanks for being responsive, Michael!

    Plugin Support Michael Beckwith

    (@tw2113)

    The BenchPresser

    If you have a GitHub account, we would love to see the ideas fleshed out and changes provided in an issue over at https://github.com/WebDevStudios/Hash-Link-Scroll-Offset/

    That way we could review, test, tinker, etc and consider it for release.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Page jumps before scrolling smoothly’ is closed to new replies.