Skip to main content
SpazGenev
SpazGenev
Participating Frequently
November 8, 2019
Answered

Overlayed object shows on wrong place when the Preview is scrolled

  • November 8, 2019
  • 2 replies
  • 797 views

So, I have an artboard that shows up like a popup using the overlay function. On the preview page, if I've scrolled down, the popup shows up at the wrong place on the page.

 

I suspect that the overlay function uses an absolute position on the screen with hardcoded distances from TOP and LEFT, but if the Preview is scrolled, then those values (or rather the TOP value) should change.

Hope that makes any sense : )

This topic has been closed for replies.
Correct answer Kenneth Kawamoto

Logically an overlay needs to be positioned within the viewport. Sounds like you are after the component states instead?

2 replies

H
hiepp68428715
New Participant
June 17, 2023

I created a phone keyboard but when I did overlays of typed letters, they were in the wrong place.

That's because I attached the overlays to the grouped content of each letter.

But when I created an invisible rectangle on top of each letter then attached overlay to that, the resulting overlays appearing in the correct position.

K
Kenneth KawamotoCorrect answer
Community Expert
November 8, 2019

Logically an overlay needs to be positioned within the viewport. Sounds like you are after the component states instead?

    SpazGenev
    SpazGenevAuthor
    Participating Frequently
    November 11, 2019

    Well, no. The idea is that the location of the Artboard that is called through the overlay function in the Prototype mode seems to be based on the window in the Preview screen, rather than on the document itself. So that when the scroll value is 0 everything is perfectly aligned, but if I call the overlay when I have scrolled, the scrolled pixels aren't taken into account in the overlay element's position.

     

    I now realize that I might not be using the thing the way it's intended to be used. An overlay should cover the whole screen and contain a modal or some sort of information that OVERLAYS everything else, whereas I'm trying to call a popup. Sorry if I wasted your time!

     

    https://drive.google.com/open?id=1xTGNFi4C44h-oK5bJEkrv-2r8FbcGq9b

     

    https://drive.google.com/open?id=1mkN9Vjg3tyBiO3GhFSoLpHpTUtbmksGt

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices