Как изменить ориентацию Reveal.js на портретную или вертикальную?

Question

Я использую open.js, созданный hakimel, одна вещь, которую я хочу задать, можно ли изменить ориентацию раскрытия на вертикальную, чтобы она была оптимизирована для мобильных устройств?

как я использую cordova, он работает хорошо, однако, когда контент больше его высоты, я не вижу следующий контент. я пытался взломать CSS, так что прокручивать, вот мой CSS:

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

и применить его к моей секции элемента <section class="scrollable">, но все еще находится в ландшафтном режиме, так что верхняя и нижняя части экрана слева пустой. его такой отход.

Если нет способа, пожалуйста, обратитесь к нам за презентацией html, которая оптимизирована для мобильных устройств, но также поддерживает рабочий стол. я искал в google, но все еще не нашел или, возможно, пропустил один. Большое спасибо.

Answer 1

вы можете изменить разрешение слайда в соответствии с размером устройства при настройке показа, но вам нужно будет убедиться, что ваши слайды могут адаптироваться к изменениям размеров.

Чтобы создать полностью реагирующие слайды:

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

setInterval(resizeSlide, 1000); 

вам нужно будет сделать содержание слайдов реагирует на изменения в формате слайд, но это заставит их использовать полную страницу для презентации. Я использую setInterval, а не onResize, потому что onResize просто не работает/недостаточно надежен в отношении изменений ориентации на мобильном устройстве и некоторой комбинации браузера/os