Highlighted
Contributor
Contributor

vCenter HTML 5 Reactive User Interface not scrolling

We've been working on a new HTML 5 plug-in for vCenter and things are looking pretty good.

However, I recently tested on an iPad using Chrome and noticed a somewhat different behavior than on my MacBook using Chrome.

We have some tables that are wider than will fit on the browser window.

On the Mac, I can scroll to the right and see the table columns.

On the iPad, I can only scroll to the right the amount used in VMware defined webpages, but not to the far right of the tables in our plug-in.

Is there a <div> or something that I could wrap our pages with to cause them to be limited in width to the same amount as VMware plug-ins?

     Best Regards,

         Michael

0 Kudos
2 Replies
Highlighted
Hot Shot
Hot Shot

Unfortunately, you cannot edit vCenter HTML5 files.

In my opinion the easiest way to work around this would be to ask Chrome to fetch a desktop version of the website instead of the mobile one. This way you should be able to scroll to the right and view all the columns just like on the Mac version of Chrome. You can find the "Desktop Site" option by tapping the settings button in your iPads Chrome window.

Hope that helps

Cheers, Paul Wilk
0 Kudos
Highlighted
VMware Employee
VMware Employee

Hi Mike,

This can be handled in the plugin as follows:

  • The table is made to use automatic width and a flexible box.
  • If the minimum width is reached a scrollbar appears.

I verified this works for vSphere HTML Client 6.5U1 and 6.7 (not sure about earlier versions).

You can see it in action with the html-sample part of vSphere Client SDK 6.7.

Here is a screenshot:

pastedImage_3.png

Cheers,

Vladi

0 Kudos