Как изменить положение контента в полноэкранном режиме для слайдов xaringan

Я записываю видео, в котором я помещаю себя и слайды ксарингана рядом. Поэтому я хотел бы переместить контейнер слайдов с правой стороны, чтобы у меня было место, чтобы стоять слева.

Вот пример слайда:

---
title: "Incremental Slides with xaringan / remark.js"
author: "Yihui Xie"
date: "2017/08/31"
output:
  xaringan::moon_reader:
    css: ["test.css", "default", "default-fonts"]
    lib_dir: libs
    nature:
      countIncrementalSlides: false
      ratio: '16:9'
---

```{r setup, include=FALSE}
options(htmltools.dir.version = FALSE)
```

# Three ways to build incremental slides

In remark.js, you may use

А вот код CSS, который я пытался переместить вправо:

html.remark-container, body.remark-container {
  width: 93%;
  float: right;
}

.remark-container:-webkit-full-screen {
  width: 93%;
  height: 100%;
  float: right;
}

После разрыва слайдов положение - это то, что я хочу, когда оно НЕ в полноэкранном режиме. Но после входа в презентационный или полноэкранный режим контейнер центрируется, и я не знаю, как его переместить в правую сторону. Любые идеи? Спасибо!

А вот информация о моей сессии:

R version 3.4.2 Patched (2017-10-01 r73429)
Platform: x86_64-apple-darwin15.6.0 (64-bit)
Running under: macOS High Sierra 10.13.1

Matrix products: default
BLAS: /System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libBLAS.dylib
LAPACK: /Library/Frameworks/R.framework/Versions/3.4/Resources/lib/libRlapack.dylib

locale:
[1] en_US.UTF-8/en_US.UTF-8/en_US.UTF-8/C/en_US.UTF-8/en_US.UTF-8

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods   base     

loaded via a namespace (and not attached):
 [1] compiler_3.4.2  backports_1.1.1 magrittr_1.5    rsconnect_0.8   rprojroot_1.2   htmltools_0.3.6 tools_3.4.2     xaringan_0.4.4 
 [9] yaml_2.1.14     Rcpp_0.12.13.2  stringi_1.1.5   rmarkdown_1.7   knitr_1.17.9    stringr_1.2.0   digest_0.6.12   evaluate_0.10.1

html css r-markdown remarkjs xaringan
person Daijiang Li    schedule 30.11.2017    source источник
comment
В итоге я использовал полный режим браузера (например, F11 в Windows) вместо полного режима замечаний.   -  person Daijiang Li    schedule 21.12.2017

Ответы (1)


arrow_upward
0
arrow_downward

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

У меня нет времени отвечать прямо на ваш вопрос, но здесь косвенный ответ < / а>. Двумя ключевыми составляющими являются: (1) вы можете встроить видео через камеру, используя navigator.getUserMedia() API, например,

<video autoplay id="webcam" width="200" height="200" style="position:absolute;top:0;right:0;z-index:100;cursor:move;" draggable="true"></video>

<script>
(function() {
  if (/remark-presenter-mode/.test(document.body.className)) return;

  // http://www.html5rocks.com/en/tutorials/getusermedia/intro/
  navigator.getUserMedia_ = navigator.getUserMedia || navigator.webkitGetUserMedia ||
    navigator.mozGetUserMedia || navigator.msGetUserMedia;
  if (!navigator.getUserMedia_) return;

  navigator.getUserMedia_({video: true, audio: false}, function(stream) {
    var video = document.getElementById('webcam');
    video.src = window.URL.createObjectURL(stream);
  }, function(e) {});
</script>

(2) Вы можете включить этот фрагмент HTML в слайды xaringan с помощью параметра includes (подпараметр after_body). Или просто скопируйте и вставьте в исходный документ Rmd (второй способ я не тестировал).

person Yihui Xie    schedule 07.12.2017