December 16, 2023
Mobile (Portrait) View on Desktop
Comments
(2)
December 16, 2023
Mobile (Portrait) View on Desktop
(2)

Hi Adobe Learning Community,

How do you display a project in mobile (portrait) view when the project is viewed on a desktop computer? The slide dimensions are set to 1080px x 1920px. It’s technically a responsive project and flexboxes are used, but again, the goal is to maintain the mobile view regardless of device. (Similar to the 7taps interface if you’re familiar with that.)

Thanks for your help.

2 Comments
2023-12-19 13:48:03
2023-12-19 13:48:03

You mention ‘flexboxes’, but not which version you are using at all? In CP2017 and CP2019 you can use Fluid Boxes to create a responsive project, but maybe you are using the most recent version 12, released end of June 2023? It is important to have that knowledge. You find the full version number under ‘About Captivate’ either under the Help (Win) or Captivate (Mac) menu.

A Responsive project will always adapt to the size of the used browser. On a desktop that will always result in a Landscape mode. If you want to have only Portrait mode, you need to create a non-responsive project where you use Portrait mode.  Publish it as Scalable HTML and it will adapt height or width to the availabe space but keep the width/height ratio.

Like
()
2023-12-19 10:29:35
2023-12-19 10:29:35

First of all which Captivate version do you use for this? Please look under “About Captivate …” like e.g. Version 12.2.0.19.

The slide dimensions you mention let me guess you are using the Classic or an older version of Cp. Anything up to version 11.8.2.x.

If so why are you using such large slide dimensions when you want a mobile-like viewport even on desktop? In Cp Classic or lower you could set up something like 375px by 800px. Under “Modify/Rescale Project…”

Generally you could present your project in an iframe with a mobile-like viewport size.

 

Like
()
Add Comment