Pricing Blog

'draw in' how to avoid it?

  • rscott-1199825300054352002

    Bishop

    1 year ago

    What are best practices if I want to hide this draw-in? It looks a little bit confusing, I think.
  • stockton_f-1199832891824287825

    Stockton

    1 year ago

    This is due to the data getting fetched from an API right? So the delay is because of the delay in the api?
  • rscott-1199853788543078522

    Bishop

    1 year ago

    yes that's right.
  • rscott-1199854190734888980

    Bishop

    1 year ago

    the big thing is when i switch to another section on the page (the 3 things on the left) and the boxes seem to not go anywhere but just fill in with new stuff which is slightly confusing. if they blanked out first or if the whole middle div faded out for a quarter second it would be a lot better. to give you the sense that something changed. a 'loading' div on top of it. i guess my designer friend would know how to do that
  • stockton_f-1199855378591137833

    Stockton

    1 year ago

    My initial thought would be to wrap the stuff in the right in a component. The componenet would hide the contents while the api is in the "is loading" state, and then show it once's it's done loading.
  • stockton_f-1199857055251574847

    Stockton

    1 year ago

    Or if those are individual components, each with their own APIs (so it would be kinda hard to wait for ALL the APIs to finish before showing each component) You could try and wrap the pieces of content in a component that just shows like the gray gradient loading placeholder during the "is loading" state in that single componenet... hopefully that makes sense.
    🔥1
  • rscott-1200276736118620221

    Bishop

    1 year ago

    it does thanks. I think you are right that was what i was thinking too, like a curtain. the thing that happens fast i can do it right after that. the draw-in with the answers isn't my biggest issue.

    although... this whole site has a 'wizard' feel to it (the graphics and theme do) so I could maybe make each of the answer boxes disolve into view by using some fancy css that's triggered after the answer comes in. that would be cool. 🙂