Question

我正准备一张RMarkdown reveal.js演示文稿。我希望幻灯片中的R代码部分在本质上是可折叠的。

我的yaml标题看起来像这样，但代码折叠在最终演示文稿中不可见。

---
title: "Untitled"
output: 
  revealjs::revealjs_presentation:
    code_folding: hide

---


## R Markdown

This is an R Markdown presentation. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>.

When you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document.


## Slide with R Code and Output

```{r}
summary(cars)
```

## Slide with Plot

```{r, echo=FALSE}
plot(cars)
```

添加code_folding: hide适用于常规RMarkdown文件。

code_folding无法进行演示吗？有什么替代方法我应该尝试吗？

Answer 1

我摆弄了一些东西。猜猜这只适用于源代码块，但可以扩展到其他元素。大多数代码都是从我上面评论中提到的答案中提取的。

完整MRE：

---
title: "Untitled"
output: 
  revealjs::revealjs_presentation:
    self_contained: true
---

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
  $chunks = $('div.sourceCode'); // get all divs containing source code...
  // add the button and a wrapping container to each of them...
  $chunks.each(function() {
    $(this).prepend('<div class=\"but_con\"><div class=\"showopt\">Show Source</div></div>');  // add the button and a wrapping container to each of them...
    $(this).find('code').toggle(); // hide them right away...
  });  

  // definition of the function to toggle visibility
  // we select all buttons, and add a click function
  $('.showopt').click(function() {
    var label = $(this).html();
    if (label.indexOf("Show") >= 0) {
      $(this).html(label.replace("Show", "Hide"));
    } else {
      $(this).html(label.replace("Hide", "Show"));
    }
    $(this).parent().siblings('pre').children('code').slideToggle('fast', 'swing');
  });

});
</script>


<style>
div.but_con {
  margin: auto;
  width: 90%;
  padding-bottom: 10px;
}

div.showopt {
  font-size: 35%;
  background-color: #004c93;
  color: #FFFFFF; 
  width: 100px;
  height: 20px;
  text-align: center;
  vertical-align: middle !important;
  float: right;
  font-family: sans-serif;
  border-radius: 8px;
  margin-bottom: 10px;
}

.showopt:hover {
    background-color: #dfe4f2;
    color: #004c93;
}
</style>

## R Markdown

This is an R Markdown presentation. Markdown is a simple formatting syntax for authoring HTML, PDF, and MS Word documents. For more details on using R Markdown see <http://rmarkdown.rstudio.com>.

When you click the **Knit** button a document will be generated that includes both content as well as the output of any embedded R code chunks within the document.


## Slide with R Code and Output

```{r}
summary(cars)
```

## Slide with Plot

```{r, echo=FALSE}
plot(cars)
```

RMarkdown揭示.js演示代码折叠

1 个答案: