Skip to main content
A
aoskachkov
Known Participant
November 3, 2018
Answered

Where are the scrollers in the prototype browser preview (Adobe XD)

  • November 3, 2018
  • 4 replies
  • 2752 views

Why the scrolls in the browser preview disapear?
See this my prototype:
Adobe XD CC

I can use my scroll button of the mouse or arrow keys from the keyboard. But if the client has no mouse it`s very unproffessional to explane the client that he have to use arrow keys of his keyboard. The common way to scroll the site is with scrollbar.
Is this any way to appear scrollbar in my prototype?

Thanks.

This topic has been closed for replies.

4 replies

L
lwikberg@cceionline.eduCorrect answer
Participant
August 17, 2020

Go here to upvote for the scrollbar to be placed back in.

https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/34467730-show-scroll-bar-in-published-prototypes?category_id=159990

 

    A
    ArtRiage
    Participating Frequently
    December 19, 2018

    Mine also have different heights of artboards.

    I can scroll it vertically with the keyboard, but the scrollbar is hidden/missing.

    For prototyping, this is not even close to being acceptable lol.

    A
    aoskachkovAuthor
    Known Participant
    December 20, 2018

    You can scroll with arrows but in Chrome only. You can`t scroll with arrows in Firefox or Internet Explorer for example.

    Imagine the next situation.
    You do prototype for a client who wants to send it to some investors but he don`t know what browser they use.
    If some of  the investors have Firefox in laptop without mouse for example, they won`t scroll your prototype.

    A
    ArtRiage
    Participating Frequently
    December 18, 2018

    How are you able to fix it? My browser's vertical scrollbar is hidden when I publish the prototype.

    I can scroll it by using the arrow keys, but the scrollbar itself is hidden.

    Ares Hovhannesyan
    Community Expert
    Ares HovhannesyanCommunity Expert
    Community Expert
    December 19, 2018

    I can see scrollbar.

    Similar situation happens when we have a Master page with height which is bigger than for other pages. Usually i deal with this situation when i work with Muse. But I am nit sure as you told that all dartboards have the same height..

      A
      aoskachkovAuthor
      Known Participant
      December 19, 2018

      You can see the scrollbars but with pages with different weight this looks ugly and you know that I have sent my work XD files to adobe stuff and no desition about this problem.

      You can see the scrollbars and the prototype works good ONLY WHEN THE ARTBOARDS ARE INTHE SAME HEIGHT (this is imposible in desktop prototypes) AND THE VIEWPORTS ARE IN THE SAME HEIGHTS.
      The prototypes for desktop web sites in broser are total buggy.

      I can share my work XD files with you too and if you can do desktop prototype for browser with scrollers and not buggy it will be good.

      I copy paste the same text from my other discussion:

      Unusable XD prototypes in browser

      "

      Hi @Anul_Saini ,
      Thanks for the reply.

      Yes my pointer is above the prototype then I focused it by click and can scroll but wth mouse scroll button only because no scrollbars. If this prototype is opened in laptop no chance without mouse. The arrows work but in Chrome (Safari too maybe) but they don`t work in Firefox and Internet Explorer.

      I did the next tests which I described in other post too (1920 with because this is the resolution of my PSDs and I don`t wanted to resize them because this is test only):

      1. This is a prototype with artboard 1920 and viewport 1080 (1920 x 1080).
      Adobe XD CC
      No scrollbars here. I need them because my client wants to send the prototype (not this but other) to his investors and don`t know how they will open it - browsers, resolutions, with mouse, without mouse etc. Scrollbars are needed.

      2. This is a prototype with artboards with different height and viewport height is same as the artboard (no viewports). Here are the scrollbars but see what hapens if you click on the links. The prototype doesn`t work as prototype and scale till get the real size. This looks ugly.
      Adobe XD CC

      3. This is a prototype with artboards in same height and no viewports. Here are the scrollbars but this isn`t right fix because some of the pages has too much space from the bottom. The page reach bottom and continue to scroll because the artboards are in the same height. (scroll to bottom of every page)
      Adobe XD CC

      --------------This is the same prototype in inVision and works perfectly. Without white borders around, with scrollbars. It looks like real web site.
                          https://invis.io/2AOXO4U7KYJ

      Thanks!

      "

      Ares Hovhannesyan
      Community Expert
      Ares HovhannesyanCommunity Expert
      Community Expert
      November 4, 2018

      Are you toggle-on "Open in Fill screen" feature when publishing?

      Here are some tips:

      Improvements in standard and full screen view:

      • If the artboard width is greater than the available horizontal space, the prototype scales to fit the width with no horizontal scrolling.
      • If you have defined the viewport height (set in the Property Inspector), the prototype fits to the height first and proportionally scales width to maintain the aspect ratio. You can also scroll vertically to view content that is below the viewport height.
      • If the designed prototype is a web or a custom artboard, the published link in the web browser in full screen mode renders the content from the top of the browser window. Mobile and tablet designs continue to be center aligned in the screen.
      • The background color in full screen mode is white instead of black. This mimics true browser behavior where browsers do not add a black background color by default.

      Improvements in mobile artboard view:

      • Content fits height wise and adjusts width to maintain aspect ratio.
      • If you view the published link in a full screen mode on a web browser, the content renders in the middle of the browser window.
      A
      aoskachkovAuthor
      Known Participant
      November 4, 2018

      Yes, I toggle on "Open in fullscreen" but here is the same problem.
      I did some experiments too.

      1. This is with artboards with different height and viewport height is same as the artboard (no viewports). Here are the scrollbars but see what hapens if you click on the links. The prototype doesn`t work as prototype and scale till get the real size. This looks ugly.
      This is online example:
      Adobe XD CC


      2. This is with artboards in same height. Here are the scrollbars but this isn`t right fix because some of the pages has too much space from the bottom. The page reach bottom and continue to scroll because the artboards are in the same height.

      This is online example:

      Adobe XD CC

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