带有 knitr 幻灯片的长功能垂直滚动条答案

【问题标题】：Vertical scrollbar for long functions with knitr slides带有 knitr 幻灯片的长功能垂直滚动条
【发布时间】：2018-02-09 23:19:35
【问题描述】：

是否可以使用 knitr 幻灯片制作长功能的垂直滚动条（使用 xaringan 自定义样式）？我根据上一个问题How to make vertical scrollbar appear in RMarkdown code chunks (html view) 尝试了一些选项，但不知道如何仅针对长功能（高度超出框架）执行此操作。任何建议都非常受欢迎。

---
title: "title"
subtitle: "subtitle"
author: "author"
date: "2017"
output:
  xaringan::moon_reader:
    lib_dir: libs
    css: ["default", "style.css"]
    nature:
      highlightStyle: zenburn
      highlightLines: true
      countIncrementalSlides: false
---

```{r , echo=FALSE, include=FALSE}
library(knitr)
opts_chunk$set(fig.align='center', message=TRUE, error=TRUE, warning=TRUE, tidy=TRUE, comment = "##", echo = TRUE, dev='svg')
options(width=65)
```

```{r}
fu <- function(x){
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
}
```

【问题讨论】：

标签： css knitr r-markdown remarkjs xaringan

【解决方案1】：

你试过this answer的解决方案吗

.scrollable-slide {
    height: 800px;
    overflow-y: auto !important;
}

【讨论】：

类似的东西适用于 xaringan，但前提是我将长代码附在规范中，而不是作为完整幻灯片的类。因此，我新开了一个Stackoverflow question。

【解决方案2】：

我不是 CSS 专家，因此不能保证这是一个可靠的解决方案，但在代码块的样式中添加 max-height 和 overflow-y 似乎效果很好。根据需要调整最大高度，200px 相当短，仅用于演示其工作原理：

<style>
pre.sourceCode {
    max-height: 200px;
    overflow-y: auto;
}
</style>

我不确定代码块的类名是否会随着不同的输出格式而改变，我使用的是slidy_presentation，因为我没有安装您的渲染器，因此您可能需要检查输出中的类。

【讨论】：

它没有用。也许它必须与输出类有关。我使用的风格是example.css。如何检查输出类？

【解决方案3】：

在您的style.css 中，创建一个将 y 溢出定义为滚动和所需 div 高度的类（请参阅此 SO answer 作为参考）

.pre {
  height: 10pc;
  overflow-y: scroll;
}

然后将该 css 类应用到代码块：

.pre[
```{r}
fu <- function(x){
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
  x
}
```
]

【讨论】：