How to change Reveal.js orientation to portrait or vertical?

i use reveal.js created by hakimel, one thing i want to ask is, is it possible to change reveal orientation to vertical so it is optimized for mobile?

as i use cordova, it is working well, however when the content is more than its height, i cannot see the next content. i have tried to hack the css, so it is scrollable, here is my css:

.scrollable {
                margin-top: -200px;
                bottom: 0px;
                overflow-y: auto  !important;
                overflow-x: hidden !important;
            }

and apply it to my section element <section class="scrollable">, but it is still in landscape mode, so the top and bottom of screen left blank. its such a waste.

if there is no way, please refer me some html presentation that is optimized for mobile but also support desktop. i've been searching on google but still not found, or maybe missed one. thank you very much.

Solution

you can change the slide resolution to match the device size when you configure reveal, but you'll have to make sure your slides can adapt to sizing changes.

To create fully responsive slides:

var resizeSlide = function() {
   Reveal.configure({
     width: window.innerWidth,
     height: window.innerHeight
   });
}

setInterval(resizeSlide, 1000);

you will then need to make your slides content is responsive to changes in slide format, but this will make them utilize the full page for the presentation. I'm using setInterval and not onResize because onResize just don't work/isn't reliable enough across orientation changes on mobile and some browser/os combination